script.js

let notes = document.getElementById("notes");

// ------------------------------------------------------------------------------------------------

window.addEventListener("load", home_page());

// ------------------------------------------------------------------------------------------------

function html() {

    let html_content = `

        <h1>HTML</h1>

        <hr>

        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quibusdam blanditiis assumenda, nemo ut eos qui
            voluptatibus ea voluptatum, molestias sapiente doloremque voluptatem aliquam nesciunt eveniet, libero nisi
            autem repudiandae tenetur fugit iusto sunt excepturi ipsa tempore natus. Quo aut expedita praesentium
            aliquid asperiores tenetur eaque assumenda fuga cupiditate neque totam nihil illo nostrum amet, suscipit,
            sint sapiente nobis dolorem dolorum et atque magnam repudiandae qui. Fugit, architecto. A repellendus
            doloribus eos! Cupiditate ipsam officia eos, tempora commodi exercitationem optio sint quam veniam porro
            nostrum placeat aliquam, repudiandae explicabo sunt deserunt labore natus doloremque! Autem veniam in
            provident vel odio sint tenetur quod reiciendis, temporibus laboriosam dolores voluptatibus animi vitae
            inventore nihil modi voluptatum, debitis nisi recusandae distinctio. Repellat, officia quia eveniet
            reprehenderit dicta neque quod dolore voluptatem aliquid? Quos placeat maxime, perferendis ut impedit aut
            quas dolor minus, expedita inventore accusamus excepturi officia hic eligendi culpa dolorem corporis rerum
            magni provident labore modi error explicabo. Consequatur quod quisquam voluptate odio! Incidunt perspiciatis
            labore facere quos veniam harum architecto exercitationem quod tenetur voluptas sapiente, neque odit
            repellendus accusantium at delectus fuga eaque deserunt nobis. Quia nostrum, aperiam et animi excepturi ut
            praesentium labore expedita impedit nesciunt nisi quaerat voluptates laudantium porro sequi minima
            laboriosam reprehenderit sapiente velit voluptate quas itaque a exercitationem. Repudiandae quod quis
            doloremque vitae incidunt ipsum magni excepturi voluptatibus, perferendis maiores! Molestiae labore
            accusamus laudantium officiis tempora delectus explicabo velit unde? Perspiciatis numquam voluptatibus unde
            sapiente laboriosam nihil, error aspernatur omnis officia, assumenda totam dolor ipsam architecto nobis
            explicabo dignissimos eligendi, qui quisquam porro nemo ratione! Et sed voluptate error voluptatem ipsa
            eaque, exercitationem nisi hic itaque nemo eveniet tenetur facere molestiae aliquam. Beatae corrupti dolores
            similique ad, dicta aliquid sint consectetur. Saepe ipsum ducimus beatae, laboriosam quam accusantium facere
            alias quia magni qui voluptatum laborum enim, sunt corrupti ex quasi doloribus. Repellat in id accusantium
            voluptatum tenetur corporis esse debitis quas magni, et magnam delectus dicta illo maiores explicabo
            deserunt. Quos odit, quo qui vitae illo incidunt ipsam esse cum dolorem officia rerum soluta quis et quas
            eius corporis, eveniet sapiente in sint ut nesciunt repellendus assumenda. Deleniti repellat nulla provident
            alias suscipit. Exercitationem quos labore expedita tempore sit ducimus in magnam excepturi est nobis non
            quisquam, nam provident, odio hic, accusamus temporibus voluptatem debitis quas. Accusantium ea consequatur
            error aliquid, fugiat animi nam aut consectetur inventore. Veritatis neque accusamus, fugiat quo dolorum
            quae incidunt laboriosam cumque nobis, atque exercitationem illum? Expedita mollitia voluptate, dolores vel
            atque autem quas consequatur quae perspiciatis sapiente vero perferendis sunt repudiandae ad placeat in ut
            voluptatem quidem veritatis molestiae? Ab maxime quod magni inventore obcaecati officia, praesentium soluta
            velit voluptates laudantium numquam architecto magnam explicabo optio quaerat animi minima, placeat aliquam
            adipisci sequi ex repudiandae nemo doloribus? Fugiat illum error laborum perferendis exercitationem et enim
            commodi aspernatur, consectetur dolorum amet non eligendi nostrum earum ducimus in rem aliquid voluptate id
            optio cupiditate ullam. Tempore atque tenetur eos optio omnis quidem. Unde odio minus quia doloribus illum,
            placeat exercitationem velit eos maxime!</p>

            <button id="home-page" onclick="home_page()">Home Page</button>

    `;

    notes.innerHTML = html_content;

};

// ------------------------------------------------------------------------------------------------

function css() {

    let css_content = `

        <h1>CSS</h1>

        <hr>

        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quibusdam blanditiis assumenda, nemo ut eos qui
            voluptatibus ea voluptatum, molestias sapiente doloremque voluptatem aliquam nesciunt eveniet, libero nisi
            autem repudiandae tenetur fugit iusto sunt excepturi ipsa tempore natus. Quo aut expedita praesentium
            aliquid asperiores tenetur eaque assumenda fuga cupiditate neque totam nihil illo nostrum amet, suscipit,
            sint sapiente nobis dolorem dolorum et atque magnam repudiandae qui. Fugit, architecto. A repellendus
            doloribus eos! Cupiditate ipsam officia eos, tempora commodi exercitationem optio sint quam veniam porro
            nostrum placeat aliquam, repudiandae explicabo sunt deserunt labore natus doloremque! Autem veniam in
            provident vel odio sint tenetur quod reiciendis, temporibus laboriosam dolores voluptatibus animi vitae
            inventore nihil modi voluptatum, debitis nisi recusandae distinctio. Repellat, officia quia eveniet
            reprehenderit dicta neque quod dolore voluptatem aliquid? Quos placeat maxime, perferendis ut impedit aut
            quas dolor minus, expedita inventore accusamus excepturi officia hic eligendi culpa dolorem corporis rerum
            magni provident labore modi error explicabo. Consequatur quod quisquam voluptate odio! Incidunt perspiciatis
            labore facere quos veniam harum architecto exercitationem quod tenetur voluptas sapiente, neque odit
            repellendus accusantium at delectus fuga eaque deserunt nobis. Quia nostrum, aperiam et animi excepturi ut
            praesentium labore expedita impedit nesciunt nisi quaerat voluptates laudantium porro sequi minima
            laboriosam reprehenderit sapiente velit voluptate quas itaque a exercitationem. Repudiandae quod quis
            doloremque vitae incidunt ipsum magni excepturi voluptatibus, perferendis maiores! Molestiae labore
            accusamus laudantium officiis tempora delectus explicabo velit unde? Perspiciatis numquam voluptatibus unde
            sapiente laboriosam nihil, error aspernatur omnis officia, assumenda totam dolor ipsam architecto nobis
            explicabo dignissimos eligendi, qui quisquam porro nemo ratione! Et sed voluptate error voluptatem ipsa
            eaque, exercitationem nisi hic itaque nemo eveniet tenetur facere molestiae aliquam. Beatae corrupti dolores
            similique ad, dicta aliquid sint consectetur. Saepe ipsum ducimus beatae, laboriosam quam accusantium facere
            alias quia magni qui voluptatum laborum enim, sunt corrupti ex quasi doloribus. Repellat in id accusantium
            voluptatum tenetur corporis esse debitis quas magni, et magnam delectus dicta illo maiores explicabo
            deserunt. Quos odit, quo qui vitae illo incidunt ipsam esse cum dolorem officia rerum soluta quis et quas
            eius corporis, eveniet sapiente in sint ut nesciunt repellendus assumenda. Deleniti repellat nulla provident
            alias suscipit. Exercitationem quos labore expedita tempore sit ducimus in magnam excepturi est nobis non
            quisquam, nam provident, odio hic, accusamus temporibus voluptatem debitis quas. Accusantium ea consequatur
            error aliquid, fugiat animi nam aut consectetur inventore. Veritatis neque accusamus, fugiat quo dolorum
            quae incidunt laboriosam cumque nobis, atque exercitationem illum? Expedita mollitia voluptate, dolores vel
            atque autem quas consequatur quae perspiciatis sapiente vero perferendis sunt repudiandae ad placeat in ut
            voluptatem quidem veritatis molestiae? Ab maxime quod magni inventore obcaecati officia, praesentium soluta
            velit voluptates laudantium numquam architecto magnam explicabo optio quaerat animi minima, placeat aliquam
            adipisci sequi ex repudiandae nemo doloribus? Fugiat illum error laborum perferendis exercitationem et enim
            commodi aspernatur, consectetur dolorum amet non eligendi nostrum earum ducimus in rem aliquid voluptate id
            optio cupiditate ullam. Tempore atque tenetur eos optio omnis quidem. Unde odio minus quia doloribus illum,
            placeat exercitationem velit eos maxime!</p>

            <button id="home-page" onclick="home_page()">Home Page</button>

    `;

    notes.innerHTML = css_content;

};

// ------------------------------------------------------------------------------------------------

function javascript() {

    let javascript_content = `

        <h1>JavaScript</h1>

        <hr>

        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quibusdam blanditiis assumenda, nemo ut eos qui
            voluptatibus ea voluptatum, molestias sapiente doloremque voluptatem aliquam nesciunt eveniet, libero nisi
            autem repudiandae tenetur fugit iusto sunt excepturi ipsa tempore natus. Quo aut expedita praesentium
            aliquid asperiores tenetur eaque assumenda fuga cupiditate neque totam nihil illo nostrum amet, suscipit,
            sint sapiente nobis dolorem dolorum et atque magnam repudiandae qui. Fugit, architecto. A repellendus
            doloribus eos! Cupiditate ipsam officia eos, tempora commodi exercitationem optio sint quam veniam porro
            nostrum placeat aliquam, repudiandae explicabo sunt deserunt labore natus doloremque! Autem veniam in
            provident vel odio sint tenetur quod reiciendis, temporibus laboriosam dolores voluptatibus animi vitae
            inventore nihil modi voluptatum, debitis nisi recusandae distinctio. Repellat, officia quia eveniet
            reprehenderit dicta neque quod dolore voluptatem aliquid? Quos placeat maxime, perferendis ut impedit aut
            quas dolor minus, expedita inventore accusamus excepturi officia hic eligendi culpa dolorem corporis rerum
            magni provident labore modi error explicabo. Consequatur quod quisquam voluptate odio! Incidunt perspiciatis
            labore facere quos veniam harum architecto exercitationem quod tenetur voluptas sapiente, neque odit
            repellendus accusantium at delectus fuga eaque deserunt nobis. Quia nostrum, aperiam et animi excepturi ut
            praesentium labore expedita impedit nesciunt nisi quaerat voluptates laudantium porro sequi minima
            laboriosam reprehenderit sapiente velit voluptate quas itaque a exercitationem. Repudiandae quod quis
            doloremque vitae incidunt ipsum magni excepturi voluptatibus, perferendis maiores! Molestiae labore
            accusamus laudantium officiis tempora delectus explicabo velit unde? Perspiciatis numquam voluptatibus unde
            sapiente laboriosam nihil, error aspernatur omnis officia, assumenda totam dolor ipsam architecto nobis
            explicabo dignissimos eligendi, qui quisquam porro nemo ratione! Et sed voluptate error voluptatem ipsa
            eaque, exercitationem nisi hic itaque nemo eveniet tenetur facere molestiae aliquam. Beatae corrupti dolores
            similique ad, dicta aliquid sint consectetur. Saepe ipsum ducimus beatae, laboriosam quam accusantium facere
            alias quia magni qui voluptatum laborum enim, sunt corrupti ex quasi doloribus. Repellat in id accusantium
            voluptatum tenetur corporis esse debitis quas magni, et magnam delectus dicta illo maiores explicabo
            deserunt. Quos odit, quo qui vitae illo incidunt ipsam esse cum dolorem officia rerum soluta quis et quas
            eius corporis, eveniet sapiente in sint ut nesciunt repellendus assumenda. Deleniti repellat nulla provident
            alias suscipit. Exercitationem quos labore expedita tempore sit ducimus in magnam excepturi est nobis non
            quisquam, nam provident, odio hic, accusamus temporibus voluptatem debitis quas. Accusantium ea consequatur
            error aliquid, fugiat animi nam aut consectetur inventore. Veritatis neque accusamus, fugiat quo dolorum
            quae incidunt laboriosam cumque nobis, atque exercitationem illum? Expedita mollitia voluptate, dolores vel
            atque autem quas consequatur quae perspiciatis sapiente vero perferendis sunt repudiandae ad placeat in ut
            voluptatem quidem veritatis molestiae? Ab maxime quod magni inventore obcaecati officia, praesentium soluta
            velit voluptates laudantium numquam architecto magnam explicabo optio quaerat animi minima, placeat aliquam
            adipisci sequi ex repudiandae nemo doloribus? Fugiat illum error laborum perferendis exercitationem et enim
            commodi aspernatur, consectetur dolorum amet non eligendi nostrum earum ducimus in rem aliquid voluptate id
            optio cupiditate ullam. Tempore atque tenetur eos optio omnis quidem. Unde odio minus quia doloribus illum,
            placeat exercitationem velit eos maxime!</p>

            <button id="home-page" onclick="home_page()">Home Page</button>

    `;

    notes.innerHTML = javascript_content;

};

// ------------------------------------------------------------------------------------------------

function bootstrap() {

    let bootstrap_content = `

        <h1>Bootstrap</h1>

        <hr>

        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quibusdam blanditiis assumenda, nemo ut eos qui
            voluptatibus ea voluptatum, molestias sapiente doloremque voluptatem aliquam nesciunt eveniet, libero nisi
            autem repudiandae tenetur fugit iusto sunt excepturi ipsa tempore natus. Quo aut expedita praesentium
            aliquid asperiores tenetur eaque assumenda fuga cupiditate neque totam nihil illo nostrum amet, suscipit,
            sint sapiente nobis dolorem dolorum et atque magnam repudiandae qui. Fugit, architecto. A repellendus
            doloribus eos! Cupiditate ipsam officia eos, tempora commodi exercitationem optio sint quam veniam porro
            nostrum placeat aliquam, repudiandae explicabo sunt deserunt labore natus doloremque! Autem veniam in
            provident vel odio sint tenetur quod reiciendis, temporibus laboriosam dolores voluptatibus animi vitae
            inventore nihil modi voluptatum, debitis nisi recusandae distinctio. Repellat, officia quia eveniet
            reprehenderit dicta neque quod dolore voluptatem aliquid? Quos placeat maxime, perferendis ut impedit aut
            quas dolor minus, expedita inventore accusamus excepturi officia hic eligendi culpa dolorem corporis rerum
            magni provident labore modi error explicabo. Consequatur quod quisquam voluptate odio! Incidunt perspiciatis
            labore facere quos veniam harum architecto exercitationem quod tenetur voluptas sapiente, neque odit
            repellendus accusantium at delectus fuga eaque deserunt nobis. Quia nostrum, aperiam et animi excepturi ut
            praesentium labore expedita impedit nesciunt nisi quaerat voluptates laudantium porro sequi minima
            laboriosam reprehenderit sapiente velit voluptate quas itaque a exercitationem. Repudiandae quod quis
            doloremque vitae incidunt ipsum magni excepturi voluptatibus, perferendis maiores! Molestiae labore
            accusamus laudantium officiis tempora delectus explicabo velit unde? Perspiciatis numquam voluptatibus unde
            sapiente laboriosam nihil, error aspernatur omnis officia, assumenda totam dolor ipsam architecto nobis
            explicabo dignissimos eligendi, qui quisquam porro nemo ratione! Et sed voluptate error voluptatem ipsa
            eaque, exercitationem nisi hic itaque nemo eveniet tenetur facere molestiae aliquam. Beatae corrupti dolores
            similique ad, dicta aliquid sint consectetur. Saepe ipsum ducimus beatae, laboriosam quam accusantium facere
            alias quia magni qui voluptatum laborum enim, sunt corrupti ex quasi doloribus. Repellat in id accusantium
            voluptatum tenetur corporis esse debitis quas magni, et magnam delectus dicta illo maiores explicabo
            deserunt. Quos odit, quo qui vitae illo incidunt ipsam esse cum dolorem officia rerum soluta quis et quas
            eius corporis, eveniet sapiente in sint ut nesciunt repellendus assumenda. Deleniti repellat nulla provident
            alias suscipit. Exercitationem quos labore expedita tempore sit ducimus in magnam excepturi est nobis non
            quisquam, nam provident, odio hic, accusamus temporibus voluptatem debitis quas. Accusantium ea consequatur
            error aliquid, fugiat animi nam aut consectetur inventore. Veritatis neque accusamus, fugiat quo dolorum
            quae incidunt laboriosam cumque nobis, atque exercitationem illum? Expedita mollitia voluptate, dolores vel
            atque autem quas consequatur quae perspiciatis sapiente vero perferendis sunt repudiandae ad placeat in ut
            voluptatem quidem veritatis molestiae? Ab maxime quod magni inventore obcaecati officia, praesentium soluta
            velit voluptates laudantium numquam architecto magnam explicabo optio quaerat animi minima, placeat aliquam
            adipisci sequi ex repudiandae nemo doloribus? Fugiat illum error laborum perferendis exercitationem et enim
            commodi aspernatur, consectetur dolorum amet non eligendi nostrum earum ducimus in rem aliquid voluptate id
            optio cupiditate ullam. Tempore atque tenetur eos optio omnis quidem. Unde odio minus quia doloribus illum,
            placeat exercitationem velit eos maxime!</p>

            <button id="home-page" onclick="home_page()">Home Page</button>

    `;

    notes.innerHTML = bootstrap_content;

};

// ------------------------------------------------------------------------------------------------

function react_js() {

    let react_js_content = `

        <h1>ReactJS</h1>

        <hr>

        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quibusdam blanditiis assumenda, nemo ut eos qui
            voluptatibus ea voluptatum, molestias sapiente doloremque voluptatem aliquam nesciunt eveniet, libero nisi
            autem repudiandae tenetur fugit iusto sunt excepturi ipsa tempore natus. Quo aut expedita praesentium
            aliquid asperiores tenetur eaque assumenda fuga cupiditate neque totam nihil illo nostrum amet, suscipit,
            sint sapiente nobis dolorem dolorum et atque magnam repudiandae qui. Fugit, architecto. A repellendus
            doloribus eos! Cupiditate ipsam officia eos, tempora commodi exercitationem optio sint quam veniam porro
            nostrum placeat aliquam, repudiandae explicabo sunt deserunt labore natus doloremque! Autem veniam in
            provident vel odio sint tenetur quod reiciendis, temporibus laboriosam dolores voluptatibus animi vitae
            inventore nihil modi voluptatum, debitis nisi recusandae distinctio. Repellat, officia quia eveniet
            reprehenderit dicta neque quod dolore voluptatem aliquid? Quos placeat maxime, perferendis ut impedit aut
            quas dolor minus, expedita inventore accusamus excepturi officia hic eligendi culpa dolorem corporis rerum
            magni provident labore modi error explicabo. Consequatur quod quisquam voluptate odio! Incidunt perspiciatis
            labore facere quos veniam harum architecto exercitationem quod tenetur voluptas sapiente, neque odit
            repellendus accusantium at delectus fuga eaque deserunt nobis. Quia nostrum, aperiam et animi excepturi ut
            praesentium labore expedita impedit nesciunt nisi quaerat voluptates laudantium porro sequi minima
            laboriosam reprehenderit sapiente velit voluptate quas itaque a exercitationem. Repudiandae quod quis
            doloremque vitae incidunt ipsum magni excepturi voluptatibus, perferendis maiores! Molestiae labore
            accusamus laudantium officiis tempora delectus explicabo velit unde? Perspiciatis numquam voluptatibus unde
            sapiente laboriosam nihil, error aspernatur omnis officia, assumenda totam dolor ipsam architecto nobis
            explicabo dignissimos eligendi, qui quisquam porro nemo ratione! Et sed voluptate error voluptatem ipsa
            eaque, exercitationem nisi hic itaque nemo eveniet tenetur facere molestiae aliquam. Beatae corrupti dolores
            similique ad, dicta aliquid sint consectetur. Saepe ipsum ducimus beatae, laboriosam quam accusantium facere
            alias quia magni qui voluptatum laborum enim, sunt corrupti ex quasi doloribus. Repellat in id accusantium
            voluptatum tenetur corporis esse debitis quas magni, et magnam delectus dicta illo maiores explicabo
            deserunt. Quos odit, quo qui vitae illo incidunt ipsam esse cum dolorem officia rerum soluta quis et quas
            eius corporis, eveniet sapiente in sint ut nesciunt repellendus assumenda. Deleniti repellat nulla provident
            alias suscipit. Exercitationem quos labore expedita tempore sit ducimus in magnam excepturi est nobis non
            quisquam, nam provident, odio hic, accusamus temporibus voluptatem debitis quas. Accusantium ea consequatur
            error aliquid, fugiat animi nam aut consectetur inventore. Veritatis neque accusamus, fugiat quo dolorum
            quae incidunt laboriosam cumque nobis, atque exercitationem illum? Expedita mollitia voluptate, dolores vel
            atque autem quas consequatur quae perspiciatis sapiente vero perferendis sunt repudiandae ad placeat in ut
            voluptatem quidem veritatis molestiae? Ab maxime quod magni inventore obcaecati officia, praesentium soluta
            velit voluptates laudantium numquam architecto magnam explicabo optio quaerat animi minima, placeat aliquam
            adipisci sequi ex repudiandae nemo doloribus? Fugiat illum error laborum perferendis exercitationem et enim
            commodi aspernatur, consectetur dolorum amet non eligendi nostrum earum ducimus in rem aliquid voluptate id
            optio cupiditate ullam. Tempore atque tenetur eos optio omnis quidem. Unde odio minus quia doloribus illum,
            placeat exercitationem velit eos maxime!</p>

            <button id="home-page" onclick="home_page()">Home Page</button>

    `;

    notes.innerHTML = react_js_content;

};

// ------------------------------------------------------------------------------------------------

function home_page() {

    notes.innerHTML = `

        <h1>(: Welcome To Web Development Notes :)</h1>

    `;

};