Web development, where to start

• Dorian Kingi
• March 16, 2022
• 0

At the start, it is sometimes unclear which programming language to choose first. In fact, there is no perfect language that will define your career once and for all. Learning a new programming language is like learning another foreign language. First you need to decide which suits you best: frontend or backend.

Choosing a direction
From the frontend, backend and all this, the head can go round — so let’s decide.

Frontend
This is what the user sees and interacts with on the page. Design, visual elements, diagrams — the entire front side. The tasks of the frontender are to make a website that will solve the tasks of the owner, work equally correctly on all devices, regardless of the browser and screen size, and at the same time will be convenient for the user. Basic tools: HTML, CSS and JavaScript. Suitable for those who are meticulous about details and want to immediately see the result of their work.

Backend
The invisible part of the site. The backend developer is responsible for what is hidden from the user’s eyes and works on the server. For example: creates databases and programs that will write information to the database; encrypts passwords and valuable information; configures access and data backup system; writes programs that process information invisible to the user.

There are several programming languages for the backend: PHP, Ruby, Python or Node.js . Backend development requires database management systems: MySQL, PostgreSQL, SQLite or MongoDB.

Suitable for those who are interested in working with data and solving architectural problems.

Page layout
Regardless of what you choose: frontend or backend, you will have to interact with web pages. To do this, you need to study HTML and CSS.

HTML
It is a hypertext markup language. Responsible for the structure and content of the page. It consists of tags, and the tag consists of a name enclosed between the signs “less” and “more”. For example:

, and . Remember how you work with a document in a text editor. You write text, highlight fragments in italics or color, insert pictures or tables. A web developer does the same in the code editor using tags. Instead of the *.txt extension, *.html is used here. It makes it clear to the browser that the code of the web page is inside the file. The browser parses its structure, determines the relative position of elements and visualizes them. HTML web standards are described in the specifications. This is the main source of knowledge for both browsers and developers. It is important to keep track of their updates. CSS
This is the language that is used to style your markup. For example: make the text red, align to the left, round the corners of the image, play with fonts, make the margins larger or smaller. The tag is responsible for the formation of a text paragraph. Let’s say we need all on the page to get the same properties. To do this, you need to connect styles to the page. As long as they are not connected, there will be no effect from them. Styles can be embedded inside the HTML code of the page (inline) or connected as an external file. Most often styles are connected from an external file with the extension *.css. This way the markup is separated from the styling, the probability of error is reduced, the external file is cached and not downloaded again. To connect from an external file, the tag is used. Knowledge of the basics of HTML and CSS will allow you to create simple websites with text content. If you want something more complicated, you can’t do without programming languages. Programming
JavaScript
A browser-based programming language for frontend development. It is supported by all popular browsers. Every website, every web application that you have used contains JavaScript code. It is often recommended for beginners to study, because it is quite simple, but contains all the fundamental things: an object-oriented model and data structures. It is used to animate HTML pages: to add processing of user actions or interesting visual effects to the page. With its help, you can even paint pictures on canvas. The possibilities of using JavaScript are limited only by your imagination and browser support. Don’t confuse it with Java, these are completely different languages. PHP
A server-side programming language used by backenders. It was created specifically for web development – the code written on it can be embedded in HTML. When you open your page on a social network and enter your username and password, the computer generates a request with your data and sends it to the server. On the server side, PHP receives information from the database, which also lies on the server and forms your page: passes the name, photo to the frontend, fills in the fields. The result is formatted as ready-made HTML and sent to your browser. PHP is not the most complex language, but to unlock all its features, you will need to study other technologies. For example, working with databases: SQL language, as well as MySQL, PostgreSQL, SQLite or MongoDB. A database is a place where site data is stored. These can be page texts, lists of users with their usernames and passwords, product catalogs and much more. Server logic is written in PHP for online stores, booking services, as well as large projects used by millions of people: Wikipedia, VKontakte and Facebook. The basics of the backend can be studied in the course “PHP. Professional web development”. React
A JavaScript library created by Facebook developers. Used to create web applications. You need to be able to use libraries in order to optimize code writing and not spend a lot of time searching for errors. The library stores ready-made solutions that can be used for typical tasks. React is the leader in the rating of developers by technology satisfaction in 2018. To write an application using React, it is not enough to know HTML, CSS and JavaScript. The library will have to be studied separately. But if you already have a basic knowledge of JavaScript, there will be no problems with this. Here is an example of a site made with React — “Russian Post”. If you want to understand the basics of HTML, CSS, JavaScript programming and understand if you are interested in web development, start with simulators.