Learning the basics of web development

Blackboard and teacher

This blog is about learning web development and improving your skills, but if you are new to web development you will need to learn the basics first.

Since Internet is full of good resources to learn the basics of web development, it would be pointless to build yet another resource. There are methods to learn while you practice in your browser, earning points to make it funnier. Next, I will recommend some of those good resources for you. But don’t be overwhelmed! These courses are for beginners and they go to the point, so you will complete them fast and easily.


This is like learning the alphabet, it’s a must. If you barely know HTML and CSS, even if you don’t like to build layouts at all, you still need to have a good understanding because you will be touching these languages constantly. Building prototypes, amending styles, collaborating with designers or frontend developers are examples of this essential knowledge. It defines the visual part of any website.

My recommendations:


CSS alone is enough to build any website, but when styles grow to fill a big file it becomes very difficult to maintain. Sass tries to solve that, extending CSS with useful features and making it modular, so it’s easy and comfortable to maintain.

My recommendation:


JavaScript is the most important language for the web because it is built in all browsers. You will have to use it later or sooner to make some form validations, controlling effects, or setting up third-party libraries.

It is so popular that a bunch of frameworks emerged, being NodeJS and AngularJS the most popular ones.

My recommendations:


The negative aspect with JavaScript is that is implemented differently in some browsers. To avoid these differences you can use jQuery, which takes care of this for you.

My recommendations:


JavaScript is being actively improved, but it’s still very verbose to implement some things. CoffeeScript is a language that compiles to JavaScript, providing a simpler syntax closer to Ruby (while JavaScript is closer to C).

It’s very popular and it’s supported out of the box in Ruby on Rails.

My recommendations:


My primary tool for backend development is Ruby. It’s very refreshing coming from the C-syntax, and it has a very useful framework to build websites faster: Ruby on Rails, which at the same time has an excellent community developing gems to go even faster.

My recommendations:

Ruby on Rails

Once you know the Ruby language, it’s very interesting to learn how to use the Ruby on Rails framework. You will be using all the previous skills together with Rails to actually build a website.

My recommendations:


You will probably not be working alone. You will work together with other developers and designers on the same code base. Can you imagine two people editing the same file?

To avoid conflicts and have the source code organized and synchronized for the entire team, you need to use a source control versioning tool, and the most popular is Git.

You will need to create a repository and host it (being GitHub the most popular hosting). Then you can manage your changes and fetch other’s with the git command tool. Although you can always use a GUI for that (I like SourceTree).

My recommendation:


If you arrived to this point… congratulations! You have learned the basics of web development, and now you need to practice. Don’t be scared of creating your own applications. You will find lots of obstacles and problems which are necessary to go on learning and improving. I hope to help you with that with my next articles and courses.

Don’t forget to subscribe to improve your recent and valuable skills 🙂

Did you like it? Please share it:

Get my ebook for free

10 ideas that helped me become a better developer (and may help you too)

Subscribe to my mailing list and get my ebook on 10 ideas that helped me become a better developer.

About Me

David Morales

David Morales

I'm David Morales, a computer engineer from Barcelona, working on projects using Ruby on Rails and training on web technologies.

Learn More