Answering your questions - Mailbag episode

Key Takeaways

hello my friend and friends and welcome to my podcast General musings my name is Kevin and this podcast is usually a place for me to share whatever is front of mine for me in any given week usually in some way that's related to front end development and often more specifically CSS though this week's going be a little bit different because we're going to be doing a little bit of a mini mailbag I asked for some questions from people and got got some good ones so we're going to be going over the questions that we got a few of them are actually related to some things I've been talking about recently so those will make for some nice follow-ups and also I just before we get into that though I do want to say I was recently really lucky and had got to have a conversation with Travis neelsen who if you don't know is the creator of the dev tips Channel who's the reason I actually started my own channel and yeah it was a really awesome conversation and I'm going to be posting the full interview well I'm going to edit it a little bit and post the full interview here as a podcast episode probably in about hopefully three weeks or something I have another interview with you that I'm going to be posting before that one so anyway we'll get around to it but the reason I'm mentioning it is because in the interview I did with Yuna and I have another one I'm going to be doing Miss Sara suen shortly as well part of what I added in those was sort of I wanted to capture that General musings Essence a little bit of not just talking about CSS or code and stuff and getting to know the people a little bit more and my conversation with Travis involved a lot more of that than it sort of planned originally but in a really good way and I think I want to start doing more interviews in that realm because I've been on as a guest for a lot of podcasts at this point and a lot of the time I end up talking about a lot of the very similar things in terms of my story and then getting into sort of my thoughts and beliefs and other stuff on CSS and I think like that and I think if I'm going to be having these guests on I'm sure most of them have done the same thing so I think I'm going to try and make the personal side a little bit bigger and so we get to know the people in in a way that's different from what we see them always posting and talking about though of course we'll have some code related stuff on there as well but yeah anyway it was a fantastic conversation and it's made me start thinking a lot about what I want to do with the space here and so yeah I guess that's it and we'll jump into the questions now and and let's see I have them right here and I don't want to delay too long the first one here we go the first re are actually very well tightly knit so I also actually I made a mistake I put a Google form together so people could ask their questions and I only put one field so I don't know anybody's name that ask these and I apologize or I think one person wrote their name in the in the field yeah I don't have names so I apologize for not having a name field so I can credit who asked these but the first question was what are the steps you use to study an online coding course that you've bought or how do you get the most out of a course that you've bought it's a really good question and this is something I find hard and I also think self-paced learning is hard and it's something I think a lot about since I make courses and I want to make sure my students get the most out of them and that's not easy to do I think one of the pieces of advice that I give and I know it can be it sounds silly but it's putting time on your calendar dedicated to when you're going to be learning uh and especially if you purchase a course and you spend money on a course you clearly value what you could get from it like you see that there's value there and you want to extract that value out and when you start doing the course and you sort of everybody jumps in like really you dive in right you're excited you have this new thing you want to learn and you binge through a whole bunch of lessons and then the next day you'll probably do some more and then the next day and then it sort of Fades off a little bit and then eventually you take a break and then maybe you get back into it and you do a few more lessons like three weeks later and then that binge is a lot shorter than the previous one and then you just never go back to the course again you I this is speaking from my own experience hopefully you haven't had these problems but just based on the average completion rates of online courses from the different things I've read can be anywhere from 3 to 30 which is like 3% is depressingly low I don't have any way of knowing what my own students are because of the platforms I use I really hope they're higher but I'm I always try and find ways to help but one of the things I recommend is people put time on their calendar for Learning and the reason I say that is I think people underutilize their calendars the more stuff I have on mine the more I do but I try and keep it important like I've seen Ali abdal stuff where he has like it's everything is there and I I feel like anxiety looking at his calendar whenever he shows it on screen just because like there's not a minute that's not accounted for maybe that's good maybe that's the right way to do it I like putting things on my calendar that I know I need to do so I have that time blocked off and I know I won't accidentally put a meeting during that time I won't do other stuff and when I get to that I'm going to do that and so for me when I'm doing a course or something like that or trying to learn a new subject having that on my calendar is important for me the advantage with that too is that also means when you finish the course if you're able to you can leave that time on the calendar which can be really useful because then you can just keep on keeping that block of time for learning uh and the other thing with that is make sure you put it to a realistic amount of time because some I think the same idea that we can jump in and overdo it early on and then fade away from a course if you overcommit you're not going to do it so find something that works with your schedule maybe it's 30 minutes every three days maybe it's six hours a day it depends completely on your your responsibilities and your lifestyle and everything else you have going on in your life but you need to find something you can do that you can do sustainably for a long period of time and then find what you think would work and you can adjust it obviously but do be realistic about it the other thing is just a lot of practice don't just follow a course by going through the lessons make sure you're actually doing the things the course is teaching you make sure you're not copy pasting you're writing code try and go ahead of lesson like if you know what's coming in terms or if you're reading a lesson like or or watching a video like pause and do stuff on your own don't just follow along word for word or copy the code like maybe look at it minimize the window that the code was on and try and do it yourself uh you need to be able to do it independently and so if you're just having your handheld the entire time and then you start trying to write the code you're not going to be able to do it so just getting the little bits and then you build on those little bits and you get more Independence and everything else along the way I think that's it I could go on this for a long time but we have other questions that we want to answer uh so the next one hiev can you highlight the importance of showing up every day in order to master CSS will the method of showing up regularly pay off I think it I think this goes into what we were just talking about we're having some like time to work on things will definitely help you get better at it the more you're practicing the more you're doing the better at something you will get I do think that there's different approaches you can use so like you you could show up every day for six months and the guy next to you could show or you clone yourself so it's the exact same person you have a you and your clone both of you show up for one hour a day every day for six months depending on the method and the ways that you're trying to master the subject one of you or your clone will be much better at it than the other one um and that's just because like we can more effectively use our time so that I think goes into it as well is it's like showing up is really important without that then you're never going to get better but then spending that time wisely I think also goes a long way so finding different ways to like multim moldo learning as so important we get stuck in this idea of I'm a visual learner I'm a what are the different ones whatever I prefer video I prefer written content you can definitely prefer one form over the other but there's a lot of benefit for mixing different things and most importantly actually creating stuff and that's like a really big part of it so a little bit like I said where if you are following tutorials or following other things pausing not looking at the code and trying to do things on your own trying to fix problems on your own and the other thing that I've talked about before is teaching whether that's you know they teaching or or note taking or writing a Blog talking about the things you're learning trying to explain the things that you're learning goes so far in reinforcing what you're learning finding those knowledge gaps enabling you then to fill in those knowledge gaps and then you just get better and better and the stronger the foundation you have which you build by finding any gaps you have in your knowledge the faster you add new skills after that so I think that goes a long way and that actually goes to this next question which was I listened to your previous podcast and I moved to start writing a Blog which this makes me so happy to hear that even I said I want one person who listened to that episode to start something that episode was worth it so I'm so happy to hear this so they want to start a blog about what they've learned can you kindly point me to a websites where I can write my blogs thank you so I would recommend creating your own site to write your blog from there's 11t or asro as like static site generators that make that side of things really easy to do and it gives you a new thing to learn so I would recommend having your own place if you want to get more eyeballs on your stuff I would probably say Dev 2 just because it's an established platform that I think I I don't know I've I've written some stuff on there free code Camp is always looking for authors too so depending on what you're talking about uh you might be able to get some stuff on free code camp and then if you're feeling really comfortable with what you're doing you could look on some of the more established sites Smashing Magazine I don't know what's happening with C tricks now they have like two new articles so I don't know if they're they're doing anything but like anywhere you can get it but Dev 2 I think is perfect it's also less stressful than trying to write for like one of these places like smashing or something but I would still say have your own site and you can set up when you do it to Dev 2 you can have like a can I can never say the word canonical URL so it's saying like the original source is your site and you're just crossposting it onto dev2 so dev2 can help build you know get more eyeballs and everything but you have your home where you've built it which is a good skill set right there but it's also your space and I think there's a lot of value in having your own space in today's world and not relying on places other places like even medium like that was really popular I don't if I see a thing on medium now a lot of the time I don't even go because I know that half the time it's paywalled and so yeah that's that's sort of what I think that you could also cross post a medium though is another option but I'd still really recommend having your own place to do it it doesn't you know you could even just at the beginning if you don't want to pay for a URL you could have everything set up as a static site very easily using one of the static site generators I said and or there's others I listed my two favorites but there's many others and then just use like a GitHub Pages or whatever netlify or versell or whatever you need with a you know their free tiers and you have the dot whatever webs you know a GitHub page URL and then eventually if you want to make it more of your own then you end up purchasing URL but you could run a site completely for free as a blog or whatever and you know you can even early articles could be explaining what you've built and I've seen really good blogs that are out there that like when they add a new feature to their site they make an article on how they did that feature and then I've gone and like use the stuff I've learned from that to integrate into other websites so yeah that could be really cool things to do yeah there we go those are all the questions about learning as I said it followed up a bit from last week so I thought that was cool going in a bit of a different direction is yeah 100% they are I don't use them a lot and I think I'm actually going to start doing them more in my videos I use them for things like borders a lot or outlines and small stuff there's nothing wrong with pixels anywhere other than font sizes the one place you don't want to use pixels is your font sizes just because it's it makes it less accessible so you sort of want font sizes to be something that are always based on the REM in one way or another just so it helps adhere to user settings if they have gone and set something up everything else it depends a little bit I I actually used I don't remember if it was M or REM for I think it was REM in a filter it was a backdrop filter blur or maybe just a regular blur and someone commented saying wouldn't that have made more sense in pixels because if a user had changed their settings do you want it to be more blurry and I was like oh that's a good question and I I don't know what the right answer there is I don't think it would have bothered me uh one way or the other but I was like you know what pixels might have been a better choice there if it comes to like padding in margin I could see use cases where they could be fine I tend to prefer M or Rems there just because I find when you're like so much is built around the content and the font sizes are such a big important part of that content that having that relationship of spacing to me makes sense like if I increase the font size I also want the padding to probably increase and the margins to increase because if I increased the font size and I had my margin at say say it's a margin bottom on a paragraph of 12 pixels and the font size gets bigger but that margin doesn't change that could be kind of strange and obviously if you zoom in the pixels get affected too so this isn't time about like people zooming in and out of browsers but if the font size were to be manipulated in any way and that margin bottom doesn't adjust with it that could be kind of weird and all of a sudden the spacing looks like it's getting smaller and smaller as the font size gets bigger and bigger it's not actually smaller but the relationship of that space relative to the font size is smaller so it looks like it's shrinking away but I think for like box Shadows borders I don't know lots of stuff there's there's lots of times where I think it's completely fine to use a Pickel if you're doing it for your medoc areas you're using it for I don't know what else anything basically I think you're probably okay as long as it's not for font sizes um but anytime you use any unit I think it's important to be able to say why you're using like why did I use that unit what's what's the benefit of that unit being used in that and that's the same why am I using flexbox instead of grid here you should be able to say why flexbox is the better choice if you're early on that could be really hard to do because you're not 100% sure and you're just you know I think it's going to work better is still an answer though or you know and your answer could be because I'm more familiar with flexbox than I know I can get it to work over time that might change we always change what we're doing but is you need to like yeah I think as long as you can like justify the choice of pixel in a certain situation then go for it all right moving on to another question we have what other languages do you know well apart from CSS and related to this what do you think of PHP so PHP is very different from CSS I haven't touched PHP in about a decade so I don't think I have a very I I I don't know if I can form an opinion about PHP because it's been that long since I've touched it at the time I knew enough to make custom themes of Wordpress a little bit or custom functionalities within WordPress at least so I have played with PHP it was fine it did its job what I needed it to do it's not the the favorite thing I ever used but yeah it's okay I guess and I've heard that there's been a lot of good things happening to it recently so that's good but I don't have any strong opinions about PHP to be honest other languages I know well apart from CSS CSS is like by far and large the one that I know well right that's that's the one I feel comfortable with I could sit down and teach somebody about most things CSS related without planning it and probably do a half decent job which is why that's what my channel is focused on because that's what I can sit down and teach I plan my stuff out I build my demos ahead of time I plan lessons uh I have like outlines and all sorts of stuff but if I need to I can talk about it and as I'm going through lessons a lot of time I go off script because I think of stuff that would be useful for what I'm teaching about if I'm doing that for other languages I don't have that Comfort level so like with JavaScript I have to plan a lot more and hope I don't make a stupid mistake along the way but I also don't know like as many alternative solutions to things I also don't like what I just said about being able to justify myself for things I'm doing there's a lot more because I know this works rather than I know this is the best solution so I can make stuff happen in JavaScript I can write write it relatively comfortably but I don't have the Comfort level with it to be able to sit down and teach someone JavaScript without having to plan it so I guess that's the big difference there I've mucked around with python but you wouldn't want me teaching you python yeah I've probably spent less than like 20 hours playing with python if you want to get into other things like I've used react I use I've used View and those but that's you know sort of JavaScript adjacent I guess not you know what I mean and stuff but again there it's not things that I've gone super in-depth with or play with too much so yeah hopefully that answers the question there the next one other the next couple or css questions well okay sorry I usually will do some BAS CSS changes on the universal selector the star selector such as boxing padding margin but I've seen some normalized CSS style sheets they linked to normalize.css these sheet are these sheets needed or should I stick with the basics just using any pre-made starters like this alter ownership accreditation of the final code we'll start with that final question it shouldn't no most of those are at like on Mi I think normalize anyway has like the MIT free use license or whatever when people share their resets they're they're freely shared there's not really a way to copyright that type of CSS right like it it's just maybe 50 lines of code they've put it out there in the public it's it's basically public domain so I think you never worry about it changing anything when it comes to ownership or accreditation it could be good to keep a comment in the code if you're using someone else's reset uh or normalize or whatever you want to call it just so it's there and you're acknowledging it but beyond that don't worry about it as far as are they useful yes I know normalize started as a way of making sure it's less about like getting rid of your box or changing the Box sizing getting rid of your padding in margins it was more about getting all the browsers to behave the same so back in the day even like I I should look now I haven't looked at this in a while but font weight I'm trying to think font weight okay if you if you use the strong tag it was different in Firefox and in Chrome and in Safari Chrome and Safari are the same they're both you have Chrome is it's web kit and then there was the they a branch of web Kip right for for their engine which is escaping me for whatever reason right now but chromium right with is a branch of webkit so they're the same and what it is is the the strong tag in the user agent Styles in Chrome and Safari has a font weight of bold and in Firefox it has a font weight of Boulder and there's a big difference there because if you have a font weight of say 400 on something and then you have a boulder it's going to go to the next step that's available so in Firefox if you have a font that has a font weight 500 it would choose the 500 whereas if you have a font weight of bold it would go to the 700 so You' actually have a different if you didn't declare what your font weight for your strong tag was it potentially could be different between the two browsers that's a really silly example in one sense just because it's not like a big thing that's going to have a huge impact on things but it's just one of those places that it's the first thing that came to mind on the difference between uh two different browsers and so the idea with normalize was just to make sure they're all the same uh as a starting point so you know you could run into cross browser incompatibilities and other stuff but at least when you started working on your website everybody would be on the same page and it goes into some of like the more Niche things and stuff that you wouldn't even really think about and it's just nice that you don't have to think about those things these days modern browsers have a lot less differences between them than they used to they used to if you go back far enough they were widely wildly different it was massive differences between them even you know between Internet Explorer and Netscape Navigator we didn't have a box sizing property and the two of them handled box sizing differently so you can just imagine how that went these days there's a lot less so if you look at um different resets there's like Josh KO has his and Andy Bell has his uh and there's a few others that are out there a lot of them are there's not too much that they're doing so just because CSS is in a better place but you know there's the image and making sure we have a Max width 100% and stuff like that and you'll see a few opinion things in there as well in some of them I guess it depends a little bit on the scope of your projects what you like to do and other things like that I tend to just roll my own that's sort of influenced by some of the other ones that are out there but if you just want to use normalize.css like it works perfectly fine and normalizes sort of the base for a lot of other resets like reboot Tailwind has their own that's a base on I think sanitize which is an opinion opinionated version of normalize anyway if you don't want to you don't have to but it's sort of just a nice way to set the stage and not have to think about things too much a really long way of saying that next question do you favor utility classes custom classes or a combination of both thanks for the great pod and video channel thank you I'm glad that you enjoy both of them uh I prefer a mix of both I used to be a really big bem person which is just all custom classes and over time I started using more and more utility classes just mixing them in cuz I'd be like well I don't you know like this is the I don't know if it would be like can't think of a good example but say I needed a space on something but it was the same space I needed somewhere else and the same space they needed somewhere else and there's all these different quote like blocks so normally those elements in the blocks would get different selectors on them but I only needed to change that one thing it was the thing on all of them it was just like the block system felt a little bit too rigid to me so I start started going with utility classes for those types of things and then I sort of found I find what I tend to do is I have like a pretty wide range for I have like font sizes colors and background colors so text color background color spacing those are the things I tend to use utility classes for the most and then if ever I find myself putting more than three utility classes on something i' go ah you know what this would make more sense as just making a regular custom class and putting these as properties in there makes it for me easier to maintain and easier to keep track of and work with so yeah that's sort of how I do it uh and you know maybe if I if I get to four and I'm like I'm never going to need more than four I'll put four on there but you it's sort of like that's when I get to three that's when I start thinking like should this just be a custom class instead all right next up a while ago you put up a controversial law video titled a new approach to container and wrapper classes which I loved and thought should become common use until something better comes along do you have any new thoughts on it or maybe any old thoughts you think you should be reiterated thanks so here we Stefan thank you Stefan for the question yeah so for those who don't know the video I proposed using grid as like a having a parent grid they would control your layout and then so you don't need containers or wrappers anymore and you could have different classes on elements that would sort of take up the width that you needed it to be but anything that was on you'd have like your you know main grid and any direct child of that it would sort of act as a container in a sense but you could also easily break out of it or have narrower sections as well uh I I think it's great I like using it it's definitely sort of become my new go-to of how I work and new thoughts on it I've experimented with it I got a few people asking questions about it where I'd split one of them was for like a carousel type thing like horizontal scrolling but having it line having the first item line up with whatever so if we were in like the regular width area to have it match that but you could have it match a pop out or a breakout and different things and then as you scroll the last element would line up perfectly with like the right side so I played with it more and got that working and I was pretty happy with that then I also added being able to do like splits like a 5050 split section that one made me have to rework everything a little bit CU then because there's like a grid line right down the middle you sort of have to create a whole bunch of you have to divide all your columns in half basically for the sizing anyway it wasn't too bad or not all of them but the middle one but it got there and it works well the one thing I'm trying to decide at this point is because like the one I have now that sort of has all of these features and stuff that I can use is pretty there's stuff in there I don't need all the time right like most of the time I'm not going to use that 50/50 split and I'm not going to use the carousel type element and I'm probably not going to use all the different depths of things I've done like my have like a narrower section a pop out a breakout an extra large and then the full width and like most of the time I don't need all of that either so it's like do I want to just keep it all there so it's always available and I just bring that into every project or should I have like different versions of it that I can use depending on the project I'm working on that's the main thing I'm trying to figure out because obviously the pro the good thing with it is the ease of use the hard thing with it is once it's set up it's a bit of a pain to modify if it's an an existing project so I feel like having a more robust version of it even if you're not using all of it is better so if ever you do need that breakout all of a sudden it's there versus trying to then have to build it in it's not that to do it you can add it in without breaking anything but it just takes a little bit more work so that's I guess the main thing I've been thinking about and we're going to go to the last question because I've been recording for half an hour now which is way longer than I thought I would be and I have some other questions we'll save those for another time I apologize if I didn't get to your question but what's the best way to have subtle UI animations page transitions or Andor page transitions thanks for your videos so I guess it depends on the animation or the transition uh if it's page transitions uh I mean view transitions are amazing but the multi-page view transitions are kind of limited uh it's behind a flag only in chromium right now so that is very limited but that will definitely be the solution the page transitions with those are amazing they're really easy to do like incredibly easy to do so I'm just holding off for the Post instead of coming up with really complex page transitions because actual page transitions can be a lot of work without that type of thing I think Astro actually has a really nice solution there so you could play around with that too as far as more subtle like UI animations there it depends on the interaction and you know I think the best way to have them I'm not 100% sure what you mean by the question so it depends a little bit on on the context and I just realized I've been recording for like half an hour now I had to cut a little bit out probably because my dog was barking at one point but this is gone on a little longer than I was planning so I'm going to end it here I do have a few other questions I didn't get to so I do apologize if I didn't answer your question I'll save some of these for next time and I'll do another one of these at one point or another as I said you can have a few interviews to look forward to that I have Yuna Kravitz one is coming out hopefully next week and then a week or two after that will be my one with Travis and I have a few other people lined up already to interview and a bunch of people that I want to interview so I'm really looking forward to this and it's not we're gonna have solo podcasts like I've been doing up until now but interspersed with some longer interviews and stuff like that so just a bit of an idea of what you'll be finding here if you are subscribed or you're thinking about subscribing uh with that thank you very much for listening I appreciate it very much I hope you enjoyed this episode and of course until next time don't forget to make your corner of the internet just a little bit more awesome