Ask me anything about web development

Ask me anything about web development! (Aug 2019)

I often run Q&A sessions on my Instagram account, @thecodercoder, which gives people the opportunity to ask me any kind of question they might have about web development. Hope you find these helpful!


Q: Is WordPress making front-end web development pointless to learn?

A: The answer to this is a most definite “no.” The reason is because non-tech-savvy people will always need tech-savvy people to help them with their website!

Even if a client knows how to install WordPress and make basic changes and customization in the WP dashboard, they will inevitably have an issue they don’t know how to fix. And even if they can install a WordPress theme without needing any help, they will almost always want some kind of custom style or functionality that they will need to hire an experienced web developer to do for them.


Q: Is it necessary to learn SCSS? What are its advantages?

A: Sass/SCSS is a great way of writing styles that is becoming very popular in websites and frameworks. I think it is becoming a necessary skill to learn. The good part is that once you know basic CSS, it’s not that huge a leap to learn the basics of Sass.

Some advantages are:

Organization. Ever had to search through a super long, disorganized CSS file to make a change? Being able to use multiple partial Sass files lets you organize your styles into components. For example, I might use files like globals.scss, colors.scss, header.scss, and homepage.scss.

Variables. Sass lets you create variables, for example, like $mediumBlue or $headerFont to store colors, fonts, and more! Essentially any value you know you will reuse can be saved as a variable and reused. And if you ever need to change the value, you only need to update it in the variable, instead of having to do a massive find and replace across all your CSS files.

Nesting. You can nest styles for child selectors in the parent selectors. So instead of having to write .parent .child1 { styles } and .parent .child2 { styles }, you can nest both in the parent declaration like this:

.parent {
    .child1 {
        (styles)
    }
    .child2 {
        (styles)
    }    
}

It’s much more efficient to write, and again, if you need to rename the parent element, you only need to change it in one place!


Q: Any useful CSS/Sass website links for beginners?

A: I most often refer to MDNTheSassWay.comSass-Lang.com, and CSS-Tricks.com.


Q: Is there any easy way to make a website responsive after the fact?

A: Unfortunately, no 🙁 It’s most likely going to require rebuilding the HTML markup and rewriting some CSS styles in order to make a non-responsive website into a responsive one!


Q: Grids and flexbox… when do you use each of them?

A: Generally, flexbox is good for content that goes in one direction, either rows or columns. And for content where it’s more important to make everything the line nicely, instead of conforming to a grid template.

Grid is good for content that is in both rows and columns. And when you want the content to be in a specific template style. Check out Wes Bos’ free courses on flexbox and CSS grid, they’re super helpful!


Q: What scenarios would I use units like “em” and “vw” as opposed to pixels?

A: This is actually still somewhat of a debated topic and there’s no one right answer. Generally, you don’t want to use pixels for font-size or line-height because they are not accessible if the user changes their base font size in the browser.

The em unit is useful because it makes the elements font-size relative to the font-size of its parent. So you can easily make a child element 75% of the parent by setting the child font-size to 0.75em. However this can get out of hand if you have multiple levels of nested elements that all use em’s.

Rem’s seemed to be the most recommend unit for fonts currently. They are relative, but relatives your base font-size, which is usually 16px.


Q: What do you think about which CSS properties you can animate?

A: For CSS animations, I generally only animate the transform and opacity properties. The reason for this is that while it’s possible to animate a ton of CSS properties, many of them take more effort by your browser to animate. Thus, they can slow your browser down and cause janky looking animations.


Q: What’s a good tool to test your responsive web design besides resizing in Chrome?

A: The best and most accurate way to test is by using an actual device and loading the web site. If you have a staging or test environment you can do this.

If not, there are some emulation tools like Browserstack, but I don’t know of any that are free. I personally use Chrome or Firefox dev tools because they can emulate the size of devices. Then I’ll test on real iPhone and Android devices. I also test on my PC with IE 11, Firefox, and Chrome. I don’t have a Mac so no Safari testing for me, unfortunately!


Q: Is Bootstrap still useful to learn?

A: Definitely! While you can of course write your own bespoke CSS styles, there are benefits to using a framework like Bootstrap.

One is that using a framework can make building a website faster, because the basic structure and CSS classes have been created already. If you have to meet a deadline, or your company uses Bootstrap for all their projects, this can come in handy.

The downsides are that any existing framework will have a heavier load. If you write your own custom CSS, your CSS file will be much smaller, which will speed up your website load time.

Ultimately, there are pros and cons to each approach, and you need to decide what works best for you and your situation.


Q: How old were you when learning to code, and how much time per day did you spend to learn web development?

A: I first learned HTML in high school for fun! But I first worked with web development in a professional setting in my late 20’s.

I actually never learned web development by myself at home. I learned it on the job at a data entry job that taught me programming. Then I got an entry level web development job and learned a ton through blood, sweat, and much Googling.

I think everyone will have their own way of getting into web development. There’s not necessarily an X + Y formula that will guarantee success for everyone. Try to learn and practice as much time as makes sense for you along with your other existing time commitments.


Q: What made you want to learn to code?

A: I’ve always liked working with computers and building things on there. I like the feeling of creating something from sort of nothing–it makes me feel powerful! Also, I really enjoy solving problems. This is a big part of any kind of programming or development work.


Q: How do you practice web development, other than “just make a bunch of websites” ?

A: Unfortunately, being a web developer means making bunches of web sites. So that’s the only real way to practice. It’s like being a runner–there’s no way to become a good runner without running, because that’s literally what it is all about.


Q: What’s the best language/framework to learn?

A: these types of questions are super common, and I understand why people ask them. If you’re a beginner there are just so many things to learn and it’s hard to know where to start.

However, none are better than others. And in fact, your job will largely determine what languages and frameworks that you use. My first job was using SQL, MS Access, and Vb.NET. My second job was C#, SQL, and some WordPress.

If you don’t know where to start, check job listings and see what’s most common for the jobs you can apply for.


Q: Which book would you recommend to learn JavaScript?

A: I recommend EloquentJavaScript.net or You Don’t Know JS. Both are free to read online!


Q: Do you have any tips for creating good designs?

A: Design is actually something I want to learn myself! I’ve been playing around with Adobe XD which is a free tool you can use to make mockups and designs, and it is is awesome!

As far as design tips, as a non design and developer I can just say–make sure your type is readable, give enough spacing and “breathing room” between elements, don’t go too crazy with colors, and keep things simple.

I’m trying to learn design principles from looking at examples of website designs on places like Dribble, Behance, and Frontend Mentor.


Q: What resources do you suggest?

A: For learning, I always refer to MDN and CSS Tricks. I also like using YouTube and books. I recommend FreeCodeCamp if you want to learn but are looking for a free option. Also Team Treehouse is a great resource although they are paid.

I also have a bigger list of my picks for courses and books to learn web development (check the sidebar).


Q: How long will it take you to get your first web development job? Is three months enough?

A: If you’re starting from the complete beginning, three months of self-learning is very very unlikely to be enough. Unfortunately it’s a big commitment and it doesn’t happen quickly.

I think I got more comfortable with web development after one year. After two years I didn’t struggle with impostor syndrome quite as much. And it wasn’t until year five that I felt more confident in my skills.

From what I’ve heard from people, I think 1-2 or three years is a more realistic time period to get job ready.


Thanks for tuning in!

I hope you’ve found this helpful. If you’re interested in participating in future Q&A’s, follow me on Instagram. I’m always posting mini-tutorials and helpful links related to web development that you won’t find anywhere else.

Comments

Write a Comment

at
Reply