Hey everybody! A lot of people who want to start programming or web development often find themselves lost on how they should start learning. Thus, I created this ultimate guide to coding for beginners to get familiar with the fundamental concepts of computer, internet, client-server model, programming, and more!

This guide is perfect for:

• People interested in learning how to code.
• Beginners who are struggling to understand the fundamental concepts behind programming.
• People interested in web development, but don’t know how the internet works.
• Anyone who does not know how to start learning to code.

Key concepts this guide include:

• Computers & Operating Systems
• The Internet & Websites
• Defining Front-End, Back-End & Full-Stack
• Basic Programming Concepts
• Your Next Steps To Learn Programming

So, let’s get started!

Computers & Operating Systems

The Computer

Before I jump on talking about coding and other funky stuff, let’s define what exactly is a computer.

We all are familiar with the term “computer” in general. Without a computer, you probably would not be able to read this article at this moment. But what exactly is a computer?

Think of the computer as a device that can compute numbers and process data. A calculator is one of the most simple examples of a computer. Since, it can take instructions, compute numbers, solve problems give you results. Computer’s ability is to solve problems.

How the Computer Works

Computers receive instructions or data through input devices like mouse, keyboard, etc. Even software installed on the computer can act as an input device to provide instructions to the computer.

The input device transmits the data to the Central Processing Unit (CPU).

Along with some other important components, the CPU processes the data and performs logical operations. You can think of the CPU as the “brain” of the computer.

We then get the results through an output device like a speaker, monitor, printer, etc.

Here’s a sample diagram of computer architecture.

The Operating System

An operating system (OS) is a program or software that allows you to communicate with the computer.

But wait. What is software?

Software is a set of instructions or a program written by the programmers to operate the computer and execute some specific task.

An operating system is a crucial software that you use in order to talk to the computer and perform some specific tasks. Tasks such as task scheduling, running applications, file management, controlling peripheral devices, etc.

One of the most common operating systems is Microsoft Windows 10. The OS takes high-level instructions and then translates them into low-level code that the machine can understand.

The Internet & Websites

The Internet

Let’s talk about the internet!

Back in the 1970s, there were computer networks created mainly for the use of transferring messages between some particular institutes for research purposes.

And since then, those small computer networks has evolved tremendously to this one giant network. This giant network consists of thousands, if not millions of computer networks communicating with each other at every second.

Today this humongous giant global computer network as we know is the internet.

The Client-Server Model

As a programmer, let’s start familiarizing ourselves on a very important concept when it comes to the internet. It is the client-server model.

In a client-server model, a server is a computer or a device on the internet that provides and manages network resources.

The client, on the other hand, is the computer that requests and receives the information from a server.

The transmission of information between the client and the server takes place through a set of rules or protocols known as the Hypertext Transfer Protocol.

Then the server responds with the information that the client requested. We refer to this whole process as the client-server model.

Servers are generally computers with high configurations, such as powerful processors, more memory and large disk drives.

There is also something that works in between the client-server model. That is the node.

Node is a device or a connection point that is responsible for sending, receiving and forwarding the information to the client.

Some of the common nodes are routers, modems, hubs, etc. In order to fulfill the client’s request, the information has to pass through the node to reach the client.

IP Address

IP stands for Internet Protocol. The IP address is a string of numbers that are separated by periods. Each computer on a network has a unique IP address as an identifier

There two types of IP addresses. IPv4 & IPv5.

An IPv4 should look like this:

159.123.123.144

In most cases, you will see the IPv4 address which is a 32-bit address system.

An IPv6 looks something like this:

ee20:0000:db112:0000:0000:12bc:7223:0312

The IPv6 uses the 128-bit address system.

Don’t worry about the IPv4 or IPv6 for now. Just know that IP addresses are unique identifiers of computers and devices on the network to help transmit information.

In addition to that, IPv4 is the widely used IP addressing system on the internet.

Remember we talked about the client-server model? Both the client and the server have their own unique IP addresses as identifiers to transfer messages or information.

DNS

DNS stands for Domain Name System. The domain name system works like your phonebook that holds and controls the name of websites (domain names).

Let’s say you type in the domain name www.google.com in your browser. The DNS will then convert the human-readable domain name into the IP address that the computer will understand.

DNS holds a directory of information of the IP addresses that associate with their designated domain names.

Web Browser

A software that allows you to access websites. Some of the common web browsers are Google Chrome, Firefox, Opera, etc.

So, how does everything fit together until now?

To answer that question, let’s take a scenario in which you visit a website.

In this case, you are the client who is trying to access some documents on a server out there on the internet.

As a client, you have to access those documents through your web browser. You type in the website name or the domain name. Then the DNS looks for the IP address of that particular server associated with a domain name.

Then the web browser establishes an HTTP connection with the server that stores the website. Thus, you get to access the website and see what it has to offer.

Website

If you want to become a web developer, then it is important that you also understand what is a website.

Not only that but also to be a programmer, you need to understand this concept very well.

A website is just a one or set of text files or documents in a folder that a server stores. These text files are also known as web pages when connected to the internet.

You can set up and create a basic website with just one text file only. However, for a large-scale website with multiple different functionalities, you might want to integrate multiple different text files together.

Common text files that you will come across are:

1) .html file: Contains code written in HTML (HyperText Markup Language). HTML is a markup language that lets you create elements which are the building blocks of your website.

As a web developer, you will use HTML to create the structure and the contents of your website.

2) .css file: Contains code written in CSS (Cascading Style Sheet). We use CSS to style the HTML elements or the contents.

CSS describes how the HTML elements should look on the display. You can also use CSS directly in your .html file. But, I prefer to create an external .css file and store the stylings in there.

Here’s another post by Elaine from XOmisse, explaining the core differences between HTML & CSS.

The folder where you store these files may also contain other files which are images, back-end script (.py, .php, files) and many more which are vital for a fully functional website.

Of course, a lot of files depend on how and what a web developer wants to add to their website(s).

Defining Front-End, Back-End, & Full-Stack

Getting started with coding for beginners gets difficult in the long-run if they don’t have a clear goal on what development track they want to pursue.

Even if it is not mandatory for you to plan everything out, but it helps in the long run if you can make the decision on the path you want to move with your development career.

If you want to build websites and web applications, then there are three important concepts that you need to be familiar with.

These are:

• Front-End Development
• Back-End Development
• Full-Stack Development

Front-End Development

Front-end development or front-end programming refers to the things that you see when you visit a website.

When you visit a website on your browser, you see the overall design, colors, architecture, menus, user interfaces, etc of a particular website.

Those are the work of a front-end developer. The word “front-end” also goes interchangeably with the term “client-side”.

Front-end web developers are responsible for the interaction and the overall experience of the users. By users, I am referring to you when you visit a website or web application.

The technologies that the front-end developers work with are HTML, CSS, JavaScript, other client-side technologies, etc.

Back-End Development

Back-end developers are responsible for the “under the hood” functionalities. These are the functionalities the clients don’t interact with directly.

Back-end programming involves working servers, database, and server-side applications. One of the tasks is to work with the front-end developers to develop a large-scale web application.

Some of the technologies that the back-end developers work with are, Python, PHP, MySQL database management system, SQL server, etc.

Full-Stack Development

Full-stack development involves both, front-end and both back end part of any website or web application. If you are as passionate as me when it comes to development then this may be the track you want to pursue.

This is a challenging track but at the same time very rewarding. You must have the mentality to learn the main technologies that involve both front-development and back-end development.

Your role as a full-stack developer is to work with both the front-end and back-end developers. And to make sure that the development process goes smoothly.

Basic Programming Concepts

I will talk about some of the common programming concepts to get yourself familiar. Remember, our goal here is to build the foundation by understanding the concepts. Rather confuse you by adding unnecessary code snippets.

What is Programming

Programming, also known as coding, is the process of building computer programs or software. These programs are capable of performing vital computing operations and tasks.

Computer programmers use programming languages to create software. As we already know that software is a set of instructions for a computer to perform specific tasks.

You can think of these instructions as code.

Some of the common programming languages are:

• Java
• Python
• JavaScript (Not to be confused with Java. Two are completely different and unrelated. )
• PHP
• C++

My recommendation is to start with Python. Python is a great programming language for beginners, who have never programmed before.

A very powerful programming language that is easy to learn.

Syntax

Every programming language has its own syntax that defines a set of rules on how to structure that particular programming language.

Syntax also refers to using certain words or vocabularies and symbols.

Variables

Think of variables as containers that store information and data. You can refer to this information later to utilize and manipulate inside your program.

These containers are generally space inside the computer memory for you to store the data.

You get to name the variables and assign values to them. It is a good practice to use descriptive names for your variables.

So, whoever is using the program understands the purpose behind all the variable you create.

Strings

In coding, strings are sequence or list of characters that you put between quotations.

Comment

Comment in programming is one of the most simple concepts but yet one of the most powerful concepts that every developer has to know.

Programmers or developers use commenting to add notes inside a source code (actual code) for explanations and annotations to make it easier for humans to understand.

Every programming language has its own sign or syntax for commenting. When you use that symbol before your comment, the computer will ignore that part of your code and run as usual.

Printing

Printing is a statement in programming that you use to output results of your code on the screen. Different programming languages have different syntaxes on how to print.

Arrays

An array is a data structure that stores a set of items, values or elements. Instead of declaring four variables for storing four different strings. You can store them all together inside an array.

Each array contains data that are of the same data type. For example, an array of strings will only contain string elements and an array of integers (another data type) will only contain integer elements.

Remember arrays can contain numbers, strings or even variables but definitely not the combination of all these things.

Integrated Development Environment

IDE, also known as the Integrated Development Environment is a program that a programmer uses to make their applications or software.

It makes it easier for programmers to debug the code. Debugging is the process of checking your code for errors and fixing them.

Some of the common IDEs for programmers are Netbeans, IntelliJ Idea, Eclipse, PyCharm, etc.

Where to Start Learning

Udacity

There are multiple online platforms that offer courses on coding for beginners. But one of the platforms that I personally used and liked is Udacity.

Udacity is one of the most popular online course providers in the world. They offer a project and skills-based educational credential program which is known as the Nanodegree program.

Their Nanodegree programs are built with and valued by top companies such as Amazon, AT&T, IBM, NVIDIA, etc. Most importantly their courses itself are taught by industry-leading experts from Google, Amazon, and more.

Something that I find very helpful when it comes to coding for beginners is Udacity’s project-based approach to all the courses. As a result, students get real-world experience on their resume that is widely valued among the industries.

The good news is that they have an Intro to Programming Nanodegree program designed for absolute beginners.

Just like every other Nanodegree program, this program comes with:

• Real-world projects in partnership with industry experts.
• Access to personal career coaching sessions and services.
• 1-on-1 mentor to guide students and answering their questions.
• Learning path designed to be flexible for busy individuals.

Udacity is a great platform to advance your career. Especially if you are looking to get into programming, I highly recommend starting with their Intro to Programming Nanodegree program.

Conclusion

So, we have come to the end of this coding guide for beginners.

Now it’s time for you to take action. Learning how to program takes time and effort So, go out there and start learning.

We did talk about some of the fundamental programming concepts on coding for beginners. But remember, this is just the beginning.

My goal was not to overwhelm you with everything. You will be learning more as you go. Pick a programming language and start from there. Trust me, everything will fall into its place once you get your hands dirty.

What’s the programming language are you planning to start with?