ODev

There is always room for improvement

3 sure and fastest way to become a web developer – for beginners(with free resources)

Right now almost 59% of the world population uses the internet and the rate will continue to increase. And that will make web developers to always be in high demand

because the dependency on technology is uprising every second of every day, we bank online, shop online, work online, and many more. So web developers and web designers are like superheroes in this time of the internet age.

And the benefits of being a web developer is just too amazing to ignore if you have an inclination toward tech (which I think, whoever is reading this blog, have).

 Firstly I want to make something clear before we proceed; from the book titled ‘The road less travelled’ the first paragraph said, “Life is difficult. This is a great truth, one of the greatest truths. * It is a great truth because once we truly see this truth, we transcend it. Once we truly know that life is difficult-once we truly understand and accept it-then life is no longer difficult. Because once it is accepted, the fact that life is difficult no longer matters. ”

What that means is that Life becomes easy when you accept that it’s hard. This is not a philosophy post but from my little experience, I believe that statement is applicable to web development and programming. It’s will be helpful to have that mindset as a web developer because web development is exciting and frustrating at the same time – especially for beginners- but with that mindset, the journey will be endurable and fun even simple.

who is a web developer

A web developer is a programmer that develop website and web application on the web with certain tools and technologies.

How to become a web developer

 There are three basic ways to become a web developer:

  1. Obtaining a computer science degree in college
  2. Enrolling in boot camps 
  3. Self- teaching through making research on the internet and taking courses.

since we are talking about the fastest way we will talk more about 3.

Steps to become a web developer 

  • UNDERSTAND THE BASICS OF HOW THE WEB WORKS 
  •  UNDERSTAND THE BASICS AND FUNDAMENTALS OF THE PROGRAMMING LANGUAGES AND TOOLS FOR WEB  DEVELOPMENT
  • START BUILDING PROJECTS AND MORE PROJECTS.

UNDERSTAND THE BASICS OF HOW THE WEB WORKS:

How do websites work?

All websites are basically, a bunch of files that are stored on a computer called a server. This server is connected to the internet. You can then load that website through a browser (like Chrome, Firefox, or Safari) on your computer or your phone. Your browser is also called the client in this content

So, every time that you’re on the internet, you (the client) are getting and loading data (like animals pictures) from the server, as well as submitting data back to the server (load more pictures!) This back and forth between the client and the server is the basis of the internet. And it’s sent through a primary protocol called HTTP(Hypertext Transfer Protocol) or HTTPS(Hypertext Transfer Protocol Secure).

Anything that you can access in your browser is something that a web developer built. Some examples are small business websites and blogs on the simpler side, all the way up to very complex web apps like Facebook, and Twitter Airbnb etc.

UNDERSTAND THE BASICS AND FUNDAMENTALS OF THE PROGRAMMING LANGUAGES AND TOOLS FOR WEB  DEVELOPMENT

difference between front-end and back-end?

The terms “front end,” “back end,” and “full-stack” web developer describe what part of the client/server relationship you’re working with.

“Front end” means that you’re dealing mainly with the client-side. It’s called the “front end” because it’s what you can see in the browser. Conversely, the “back end” is the part of the website that you can’t really see, but it handles a lot of the logic and functionality that is necessary for everything to work.

One way you can think about this is that front-end web development is like the “front of house” part of a restaurant. It’s the section where customers come to see and experience the restaurant– the interior decor, seating, and of course, eating the food.

On the other hand, back-end web development is like the “back of house” part of the restaurant. It’s where deliveries and inventory are managed, and the process to create the food all happens. There’s a lot of things behind the scenes that the customers won’t see, but they will experience (and hopefully enjoy) the end product– a palatable meal! (The illustration is making me salivate)

Basically front and back end web development serve different but very important functions.

.2: Basic front-end:

The front-end of a website is made up of three types of files: HTML, CSS, and JavaScript. These files are what is loaded in the browser, on the client-side. Let’s take a closer look at each one of them.

HTML

HTML, or HyperText Markup Language, is the foundation of all websites. It’s the main file type that is loaded in your browser when you look at a website. The HTML file contains all the content on the page, and it uses tags to denote different types of content.

For example, you can use tags to create headline titles, paragraphs, bulleted lists, images, and so on. HTML tags by themselves do have some styles attached, but they are pretty basic, like what you would see in a Word document.

CSS

CSS, or Cascading Style Sheets, lets you style that HTML content so it looks nice and fancy. You can add colours, custom fonts, and layout the elements of your website however you want them to look. You can even create animations and shapes with CSS!

There is a lot of depth to CSS, and sometimes people tend to gloss over it so they can move on to things like JavaScript. However, I can’t overestimate the importance of understanding how to convert a design into a website layout using CSS. If you want to specialize in front-end, it’s essential to have really solid CSS skills.

JavaScript

JavaScript is a programming language that was designed to run in the browser. Using JavaScript, you can make your website dynamic, meaning it will respond to different inputs from the user or other sources.

For example, you can build a “Back to Top” button that when the user clicks it, they’ll scroll back up to the top of the page. Or you can build a weather widget that will display today’s weather based on the user’s location in the world and it deals with the interaction between the browser and the client, like live search in a website and the dynamic features.

 If you want to develop your skills later on with a JavaScript framework like React, you’ll understand more if you take the time to learn regular vanilla JavaScript first. It’s a really fun language to learn, and there’s so much you can do with it!

Back-end:

 The back-end deals with the part that the clients don’t really see. These parts take care of the functionalities and deals with the database. The languages used here are PHP, PYTHON, RUBY, JAVA, NODE.JS.

Node.js: is a very popular technology (according to Stack Overflow’s 2019 developer survey). One thing to note: it isn’t technically a server-side language– it’s a form of JavaScript that runs on the server using the Express.js framework.

PHP: So far PHP is the most used backend programming languages. It’s the language that powers WordPress, It can also be used with MYSQL for the database.  this might be a good choice if you think you will be working with small business websites, as many of them use WordPress. You can also build web apps with the Laravel framework.

Tools and frameworks

Using a code editor 

When you build a website, the most essential tool that you will use is your code editor or IDE (Integrated Development Environment). This tool allows you to write the markup and code that will make up the website.

There are quite a few good options out there, but currently the most popular code editor is VS Code. VS Code is a more lightweight version of Visual Studio, Microsoft’s main IDE. It’s fast, free, easy to use, and you can customize it with themes and extensions.

Other code editors are Sublime Text, Atom, and Vim. If you’re just getting started, though, I’d recommend checking out VS Code, which you can download from their website.

FRAMEWORK:  

   Frameworks do most of the heavy lifting when building web application and website,  It provides a foundation on which web developers and software developers can build programs for a specific platform

  If you are comfortable with the basics of the language then you can start using frameworks to maximize your productivity.  

BOOTSTRAP:  Is a framework created by Twitter. If you are comfortable with HTML and CSS, you can start using Bootstrap. It makes building a responsive website easy. And it’s important for the website created to be responsive.

JavaScript frameworks

Once you have the basics of vanilla JavaScript down, you may want to learn one of the JavaScript frameworks (especially if you want to be a full-stack JavaScript developer).

These frameworks come with pre-built structures and components that allow you to build apps more quickly than if you started from scratch.

Currently, you have three main choices: React, Angular, and Vue.

React (technically a library), was created by Facebook and is the most popular framework right now. You can get started learning by going to the React.js website. If you’re interested in a premium React course, both Tyler McGinnins and Wes Bos have great courses for beginners.

Angular was the first big framework, and it was created by Google. It’s still very popular, even though it has been surpassed by React recently. You can start learning Angular on their website. Gary from DesignCourse also has an Angular crash course on YouTube.

Vue is a newer framework created by Evan You, a former Angular developer. While it is smaller in use than React and Angular, it is growing quickly and is also considered easy and fun to use. You can get up and running with it on the Vue website.

Version control

Version control (also called source control) is a system that keeps track of every code change that you make in your project files. You can even revert to a previous change if you make a mistake. It’s almost like having infinite save points for your project, and let me tell you, it can be a huge lifesaver.

The most popular version control system is an open-source system called Git. Using Git, you can store all your files and their change history in collections called repositories.

You may have also heard of GitHub, which is an online hosting company owned by Microsoft where you can store all your Git repositories.

To learn Git and GitHub, GitHub.com has some online guides that explain how to get up and running. Traversy Media also has a YouTube video explaining how Git works. Git is important these days.

Databases

Databases, as the name implies, are where you store information for your website. Most databases use a language called SQL (pronounced “sequel”) which stands for “Structured Query Language.”

In the database, data is stored in tables, with rows sort of like complex Excel documents. Then you can write queries in SQL in order to create, read, update, and delete data.

The database is run on the server, using servers like Microsoft SQL Server on Windows servers, and MySQL for Linux.

There are also NoSQL databases, which store the data in JSON files as opposed to the traditional tables. One type of NoSQL database is MongoDB, which is often used with React, Angular, and Vue applications.

Some examples of how data is utilized on websites are:

If you have a contact form on your website, you could build the form so that every time someone submits the form, their data is saved onto your database.

You can also user logins on the database, and write logic in the server-side language to handle checking and authenticating the logins.

START BUILDING  PROJECTS 

This is the most important step in becoming a web developer. Learn the basics and jump into projects as soon as possible, you can use WordPress as CMS(content management system). Build a website for yourself, for relative and anybody that need a website or a blog. The building of projects solidifies your learning and teaches you more than you realise. 

Learning is incomplete until what was learnt is implemented. From my experience, I will advise anyone to even start with building projects and then use books and resources as references and guide as you you proceed

because you will stay motivated and retain a lot of concept in your mind. So you build projects and build projects and build more projects and then you realise you are web developers

BONUS: LEARN TO BE A GOOD RESEARCHER

This is a skill that is also important to have. There are huge chances that the problem you are encountering has been solved by somebody before in StackOverflow. Not all concepts can be learnt, but by knowing the fundamentals and being a good researcher you can solve any problem that comes your way. 

Resources:

Website and blogs

Youtube:

Free Ebooks:

conclusion:

 This guide covers enough to get you started  and then you will keep learning more advanced tools and other technology(that was not mentioned here which will become easier as you go 

For absolute beginners). It will definitely become overwhelming but you must know that it’s just a phase, it will pass and when you are stuck try to get unstuck, because it’s part of the journey and its progress, appreciate it because there is always a lesson to be learnt.

 And it’s important to learn actively by coding along with the videos or materials you are using to learnt and know that you can’t learn everything once it is lifelong journey and the best way to learn is to build projects – there is no substitute for that and tutorials and blogs are not enough to learn. In fact, those materials are created to help you build projects.

It’s not an easy journey but it’s absolutely worth it and very possible. I hope this guide is helpful and I wish you luck on your journey. And your ideas are very much welcome, Share them in the comment below. Thanks.

Comments

  • You’ve said it all Boss… Becoming a web developer is indeed a difficult journey but the joy you get when you finally finish a project no matter how long it takes is uncomparable

  • Write a Reply or Comment

    Your email address will not be published. Required fields are marked *