Online courses are great and all, but sometimes you just want to be able to flip through a book.

I prefer physical books over digital ones, especially if I know I’ll need to go back to and reference it frequently. In addition, trying to read code snippets in an eBook on your phone or Kindle simply won’t do the job.

With that said, here are my top picks for the best books when you’re learning web development!

A note on affiliate linking- some of the links below are affiliate links, which means that if you purchase through them, I’ll get…


Curious what web development courses you should take?

Here are my recommended courses and online curriculum based on my own experience and research. There are both free and paid options, depending on your budget.

Hope you enjoy!

A note on affiliate linking: Some of the links below are affiliate links, which means that if you purchase through them, I’ll get a commission from the company. It’s a great way that you can support Coder Coder at no extra cost to yourself! You can read more on my disclaimer page.

Team Treehouse


Browsersync is a powerful tool that enables you to test your website in real-time. It works by spinning up a local server and syncing it up to your browser. Then, anytime you make a change in your code or files, it will reload the browser to update it immediately. Using Browsersync will help you code faster and more efficiently. It’s an incredibly helpful tool that any web developer should know how to use.

In this tutorial, I’ll walk you through how to set up Browsersync with Gulp in a basic front-end workflow. …


In today’s tutorial, we’re going to build a top navigation bar with HTML and CSS. We will look at two different ways of building this navbar, one way with flexbox, and the other with CSS grid.

It’ll be a good way to compare the differences between the two approaches. And you can see which method that you like better.

Here’s what the finished navigation will look like:


Using CSS position to layout elements on your website can be hard to figure out. What’s the difference between absolute, relative, fixed, and sticky? It can get confusing pretty quickly.

To help, this tutorial will guide you through all the CSS position properties. And you’ll be able to get your website layouts pixel perfect!

What does CSS position do?

Using CSS, you can lay out all your elements on your webpage visually. For example, you can position an element at the very top of your page, or 50px below the element before it.

To control just how an element will appear in the layout, you…


Looking for a way to improve your front-end workflow?

If you haven’t used Gulp yet, I highly recommend that you check it out. You can use Gulp to run a lot of helpful tasks, such as compiling your Sass files to CSS, processing JavaScript files, and optimizing your files.

Here are the basic steps to install and run Gulp, that we’ll be covering in this tutorial:

  1. Install the gulp-cli on your command line by running npm install gulp-cli -g.
  2. Install Gulp by running npm install gulp.
  3. Install other npm packages for your Gulp workflow.
  4. Create a gulpfile.js

These days, using a build tool is an indispensable part of your web development workflow.

Gulp is one of the most popular build tools these days — along with Webpack.

But there’s a definite learning curve to learning Gulp. One of the biggest hurdles is figuring out the seemingly hundreds of different parts that go into it.

And on top of that, you have to do everything on the command line, which can be incredibly intimidating if you haven’t worked much with it.

This tutorial will walk you through the basics of npm (Node Package Manager) and setting up Gulp…


If you’re trying to build freelance websites for clients, or even just trying to build up your portfolio, you may have come across this conundrum:

How do you build a website if you don’t have any web design skills?

Here are some options:

  • You could hire a web designer to create the design for you — but (good) designers aren’t cheap.
  • You could find a cheap designer on Fiverr or Upwork — but you know it can be risky.
  • Or you could download a free or premium theme or template — but sometimes they don’t do everything you want them…

Are you trying to learn web development, but not sure where to start?

You’ve probably already tried looking on Google for how to learn, and there are a lot of resources out there. But many of them include way too much information.

Right now, all you need is the basics of web development — a general explanation with some direction on where to go next.

And that’s exactly why I’ve written this straightforward guide on how to become a web developer…

If you’re a beginner coder, this guide is for you!

Here is what this guide covers:

  • An explanation of the basic areas in web development,
  • An overview of programming…

Are you curious about learning to code, but don’t know where to start?

Get your feet wet and make your first basic website in HTML with this tutorial!

We’ll be going over 3 things:

  1. what HTML is
  2. some basic HTML syntax,
  3. and how to make a local website on your computer.

Just a note, this post is geared toward complete beginners who have never worked with HTML before.

There won’t be any CSS or JavaScript involved, so keep in mind that this webpage we’ll be making won’t be all that pretty. …

Jessica Chan

practical tips for the beginner web developer | https://coder-coder.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store