For the first month, I had a hard time deciding the correct order of learning.
I suggested JavaScript initially, because I know how excited he was. I quickly learned this was a mistake. You really need to start with html and css.
Zach: Mike, what is the most difficult part of learning css so far? How do you feel about writing CSS?
Mike: I’d say getting your mind adjusted to all of this new information. It can be pretty overwhelming just looking at a page of html and css when you don’t have much experience under your belt. Thankfully I had a bit of experience from way way back in the day but still didn’t stop that overwhelming feeling from occurring, which I’m sure can be daunting for many when starting out this journey. Once getting into it though, I’d say just remembering the structure on how to write html and css. It’s learning a new language, and with every language there are rules to how you write it. So making sure I placed the semi colon. Making sure I didn’t forget the ending curly bracket. Making sure I put a tag before writing out a style, paragraph, etc.
CSS Grid
I had him start with Wes Bos’ CSS Grid course. I like giving people projects providing a good starting point, but ones that also requires self learning in addition.
In the case of CSS grid, he doesn’t know HTML or CSS at all, really.
I mentioned he should learn how to use MDN. It’s key to being a good programmer. You need to understand how to search for things you want to learn. I had a couple discord chats showing how to search for CSS properties and other things he’s learning.
Zach: Do you feel like you have a good grasp on grid now? Is there any confusion still, or did Wes do a great job explaining it all?
Mike: I feel like I have a better grasp of grid than I did before, especially not knowing it existed haha. I always wondered how you placed things within css and its orientation within a site. Being able to dice up your site into sections made it simple to understand and Wes did a great job at giving multiple examples of uses for different scenarios. I think as a free source out there, that course was a great stepping stone for the beginning of my journey.
Flex
I briefly taught him how flexbox works. Although I wonder how much he remembers, as he was getting really antsy for some “programming” already.
Zach: how do you feel about flexbox and what do you remember?
Mike: I’ll admit, I cheated and went on MDN to double check what flexbox was haha, but it helped verify that I remembered the basic understanding of what it is. I remember flexbox being an alternative way of building out your site. It’s more one dimensional like you either choose to build it out in rows or columns. I feel flexbox could be more simple in the sense that you’re just following one direction in a sense but grid definitely seems to have it’s advantages through versatility. But hey, I could be wrong, I’m new at this haha.
Zach: Going to MDN is always a great idea! Flex came along before grid, and it definitely has some limitations. Grid has support for gaps between items that flex doesn’t handle well. Typically we use Grid and Flex together in an application to build layouts.
Tailwind
This will be a controversial one in the comments… so I’ll just put the button here before I explain 😜
It was 2-3 weeks since I mentioned the CSS grid course. I met with Mike and I saw he was doing well, writing vanilla CSS. I also saw him itching for more. I’m always impatient as well, so I wanted to give him a cool side task without derailing him too much.
I was able to show him the tailwind site, and import the play CDN so he can use it, without having to learn about npm and other tooling just yet.
So why did I do this?
I’ve found many junior developers can’t explain why something is helpful, because they just use what they were told, and don’t know the foundations behind a tool.
Mike was writing vanilla CSS grid constantly, so it’s the perfect time to help him understand how abstractions work, and how programmers can solve problems without having to repeat so much.
But even more than that, I’ve found it’s a common trend in interviews to ask if a developer has used Tailwind. It’s just another skill to have for an interview.
I believe Mike would be able to answer this question already:
How does Tailwind and other CSS frameworks compare to vanilla CSS?
Zach: How do you feel about playing around with Tailwind and your understanding of vanilla CSS compared to a framework like Tailwind?
Mike: Let me just say, Tailwind was great to have when learning grid. My first run through of Wes Bos's course, I felt things weren't sticking, and I believe the blame goes to me wanting to run before learning how to walk. I just wanted to get to JavaScript already. For me, following tutorials can be a bit dull and not stimulating enough for me. When I just feel that I'm copying, I don't really feel that I’m learning.
Adding tailwind into the mix, it forced me to dive into seeing how things worked and why. It made me use MDN more as well and appreciate it as a powerful tool and source. But not only that, I was also able to see how tailwind can speed up your workflow compared to just writing vanilla css. Overall, tailwind kept me more engaged and I helped workout my problem solving muscle by making me research different approaches and concepts when tackling css.
That’s everything!
For the next month, Mike is starting to go through Wes Bos’s JS 30 course and the JS basics on Scrimba. Next month we will discuss and recap his progress, and then move on to React when he’s ready!
Do you have any suggestions for Mike in his next month? Let us know in the comments. I find it hard to balance his desire to be further along, versus telling him to have more patience each step of the way.