This Ending Marks a New Beginning

<div class="code-block">
            
            <section class="code-block-main">
            <h2>The End of 100 Days of Code</h2>
            <p>I'm not sure how to start this, but I'll give it a try. Even at the age of 35 I still have a massive amount to learn about building for the web. At times it feels a bit overwhelming, but at the same time it's invigorating. I've been working on websites for over twenty years and I'm still excited to see what comes over the next twenty.</p>
            <p>My first website was a Sailor Moon fan site (yeah, I know it's pretty cool) that existed only on my Windows XP (maybe 95) PC prior to even having the internet (or part of it via AOL) at home. I had to download images onto an animated GIF at my sister's place and then copy them onto my PC. I then moved onto a Dragonball Z website, and eventually put up a website on Freewebs. It was a lot of fun, and I wish I could find copies of those old sites. At that time I never thought I'd one day be paid to build and maintain websites, but I've loved it.</p><p>I'm grateful for Elizabeth Castro and her book <a href="http://www.elizabethcastro.com/cookwood/html4bookframe.html">HTML 4 for the World Wide Web: Visual Quickstart Guide</a>, that I spotted on a trip to a library a couple of miles from my house. It was an accessible and knowledge-packed book that was ideal for learning the basics of HTML. If I hadn't picked it up, and been <em>extremely lucky and privileged</em> to have my own computer to practice on, I'm not sure if I would have worked on the web.</p><p>I put in a good amount of hours to learn more about the web, but lots of people helped me along the way. I'm extremely grateful to all the people (women especially) that have written books, blog posts, articles, spoken on podcasts, and made videos about building and making things for the web. I'd like to spend the rest of the time on this post building lists of some helpful resources others may use to learn more about building websites and how to do it well.</p>
            </section>

            <section class="resources">
    
            <h3>Resources</h3>
            <h4>People to Follow</h4>
                <ul>
                    <li><a href="https://rachelandrew.co.uk/">Rachel Andrew</a></li>
                    <li><a href="https://jensimmons.com/">Jen Simmons</a></li>
                    <li><a href="https://www.miriamsuzanne.com/">Miriam Suzanne</a></li>
                    <li><a href="https://laurakalbag.com/">Laura Kalbag</a></li>
                    <li><a href="https://twitter.com/mulegirl">Erika Hall</a></li>
                    <li><a href="https://ethanmarcotte.com/">Ethan Marcotte</a></li>
                    <li><a href="https://daverupert.com/">Dave Rupert</a></li>
                    <li><a href="https://heydonworks.com/">Heydon Pickering</a></li>
                    <li><a href="https://stuffandnonsense.co.uk/">Andy Clarke</a></li>
                    <li><a href="http://adactio.com/">Jeremy Keith</a></li>
                </ul>
            <h4>Websites</h4>
                <ul>
                    <li><a href="https://alistapart.com/">A List Apart</a></li>
                    <li><a href="https://css-tricks.com/">CSS Tricks</a></li>
                    <li><a href="https://www.smashingmagazine.com/">Smashing Magazine</a></li>
                    <li><a href="https://www.a11yproject.com/">The A11Y Project</a></li>
                    <li><a href="https://briefs.video/">Webbed Briefs</a></li>
                    <li><a href="https://teamtreehouse.com">Treehouse</a></li>
                </ul>
            <h4>Podcasts</h4>
                <ul>
                    <li><a href="https://shoptalkshow.com/">ShopTalk Show</a></li>
                    <li><a href="https://podcast.smashingmagazine.com/">Smashing Podcast</a></li>
                    <li><a href="https://podcast.clearleft.com/">The Clearleft Podcast</a></li>
                    <li><a href="https://www.ladybug.dev/">Ladybug Podcast</a></li>
                    <li><a href="https://onefooter.show/">One Footer in the Grave Show</a></li>
                </ul>
            </section>

        </div>

/* CMS OVERRIDE! */
            #doodle-html {
                max-width: initial;
                margin: 1rem 0;
            }
            /* /CMS OVERRIDE */

            /* Typography */
            @font-face {
                font-family: "Blinker";
								src: url("../ast/fonts/Blinker_variable.ttf") format("truetype");
                font-style: normal;
                font-variation-settings: 'wght' 20;
                font-optical-sizing: auto;
            }

            html {font-size: 125%;} /*20px*/

            body {
            background: white;
            font-family: 'Blinker', Helvetica, Arial, sans-serif;
            line-height: 1.75;
						font-variation-settings: 'wght' 20 !important;
            color: #000000;
            }

            p {margin-bottom: 1rem; font-variation-settings: 'wght' 20;}

ul, li, h3, h4 {font-variation-settings: 'wght' 20;}

            h1, h2, h3, h4, h5 {
            margin: 3rem 0 1.38rem;
            font-family: 'Blinker', Helvetica, Arial, sans-serif;
            line-height: 1.3;
						font-variation-settings: 'wght' 30;
            }

            h1 {
            margin-top: 0;
            font-size: 4.209rem;
            }

            h2 {font-size: 1.157rem; font-variation-settings: 'wght' 171;}

            

            @media (min-width:668px) {

                h2 {font-size: 3.157rem; font-variation-settings: 'wght' 80;}

            }

            h3 {font-size: 2.369rem;}

            h4 {font-size: 1.777rem;}

            h5 {font-size: 1.333rem;}

            small, .text_small {font-size: 0.75rem;}

            /* /Typography */

            /* Base layout */

            .code-block {
                padding: 1rem;
                max-width: 75ch;
                margin: 1rem auto;
            }