How to get started with web development

So, You want to become a web developer but you are still confused about where to start. In this article, you will get a step by step guide on how you can enter the world of web development.

According to Wikipedia Web development is the work involved in developing a web site for the Internet (World Wide Web) or an intranet (a private network). Web development can range from developing a simple single static page of plain text to complex web-based internet applications (web apps) and social network services.

There are basically two types of websites — Static and Dynamic.

Static websites are written in HTML and CSS(sometimes JavaScript also). They don’t have any database or remote server. The only form of interactivity on a static website is a hyperlink. The simple websites with few pages which do not change dynamically can be called static websites.

A Dynamic website is a website that not only uses HTML and CSS but also uses server-side languages like Node.js, PHP, Python, Java etc. It is capable of developing a totally different content for various visitors from a similar source code file. The dynamic page loads the data/content from the database.

Depending on your background, you might be wondering where to start learning web development. If you’ve mainly been Googling around, you may feel just a bit overwhelmed by all the languages, frameworks, and learning resources out there. Let’s put them aside for a minute and see from where can you actually start. So let’s dive right into it.

Steps for getting started with web development

1. Learn the basics

To get started with web development you need to start with learning HTML, CSS, and JavaScript, these are the basic elements of a website you see everywhere on the web. So, in order to become a web developer, you have to learn them, you just can't skip over them.

Hyper text markup language (HTML) is a Markup language. It’s the foundation of a web page. Think of HTML as the structure of the web page and the core components that hold it together.

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML. It addresses the cosmetic side. It helps in styling the web page and making it unique.

JavaScript is what gives some life and interactivity to the web page. It is used to control the behavior of a web page.

There are many resources available on the internet to learn these languages free of cost. Just start with some HTML and CSS tutorials on youtube. It will give you a clear idea of what these technologies actually do. To get constant help in your journey of becoming a web developer, you can become an active member of a Facebook group, subreddit, or other online coding community, which is also a great place to start and to find support throughout your chosen pursuit. You can also Signup for freeCodeCamp and begin their Front End Development Certification track. Here you’ll be exposed to HTML and CSS and tasked to create your first projects! Work through the tasks until you’ve finished the Basic JavaScript module.

Other resources:- w3schools, MDN, Udemy, Udacity, etc.

2. Learn Frameworks

So, now you have a basic idea on how we can make a website. Now it’s time to level up your skill by learning a framework. A framework is defined as a package made up of a structure of files and folders of standardized code (HTML, CSS, JS documents etc) which can be used to support the development of websites or as a basis to start building a site. In layman term, the above definition of a framework basically means that it helps you write less code and add a lot more to your website.

CSS frameworks : There’s a number of CSS front-end frameworks available nowadays. But the number of really good ones can be narrowed down to just a few. These are -

Bootstrap  — Huge popularity, a lot of resources to learn it.

Semantic UI  —  Most Innovative, Clear Logic and Naming conventions.

Foundation  —  Truly professional, Used by many big websites like Facebook, Mozilla, eBay, Yahoo etc.

Materialize  —  User experience focused, Easy to work with.

JavaScript Frameworks :

React.js  —  Developer’s choice to build dynamic & high traffic web applications, maintained by Facebook.

Angular.js  —  fairly complex but used by big enterprises, maintained by Google.

Vue.js  —  Lightweight library, Easy to learn and use.

Meteor.js  —  universal scripting language, work on both frontend and backend.

Don’t get overwhelmed by all these fancy technologies, by no means you have to learn them all. Yes, you can try them out one by one but in the end, you will only end up using one or two of them for your every project.

Frontend Roadmap

After learning the above technologies, you will be able to call yourself a front end web developer. Let’s see where you can go from here after becoming a front end developer.

3. Learn Backend

Where is the data which is shown on the frontend stored? This is where the back end comes in. It is the term used for the behind-the-scenes activities that happen when performing any action on a website. It can be logging in to your account or purchasing something from an online store. The back end of a website consists of a server, an application, and a database. In order to make the server, application, and database communicate with each other, server-side languages like PHP, Ruby, Python, Java, .Net, NodeJS are used.

Server Side Languages :

Node.js  —  JavaScript server-side framework, huge popularity, single language over the entire application, event-based, non-blocking and run asynchronously.

Python  —  Popular choice, extensively used by big enterprises, easy syntax

Ruby  —  easy to read/learn, efficient for small businesses and startups

PHP  —  Still most dominant, small scale application, on a path of downhill.

Some popular frameworks of server-side languages are -

Node.js(Express, hapi), Python(Django, flask), PHP(Laravel), Ruby(ruby on rails)

Backend Roadmap

Knowledge of various DBMS technology is another important need of backend developer. MySQL, MongoDB, Oracle, SQLServer, Redis are widely used for this purpose. Knowledge of caching mechanisms like varnish, Memcached, Redis is a plus.

We haven’t gone into the deep about the front end frameworks and the server side languages as it will confuse you more. In the next article, we will dive deeper into them and will try to make you understand their role more clearly. Till then Happy Programming :)

If you like this article, please share and subscribe to our blog and do follow us on

Facebook: https://www.facebook.com/TravellingDevelopers/

Twitter: https://twitter.com/travdevs