Getting Started with Web

Getting Started in Web

Vrijraj Singh
Published in
4 min readMay 22, 2023

--

If you’re new to web development or considering a career in web technologies, this article will provide valuable information about the basics.

Let’s begin by understanding three basic terms: websites, web browsers, and servers.

1. Websites

Websites are collections of web pages that are built using various web technologies. A website typically has a main page called the home page, consisting of text, images, and audio files. Each website has its own unique address, such as www.google.com.

How to Build a Website/Web Page?

To develop websites or web pages, you can use the following technologies:

  1. HTML: This markup language is used to structure the content of web pages, using tags like <p> and <div>.

2. CSS: Cascading Style Sheets (CSS) are used to design web pages. With CSS, you can change the appearance of text, such as its color or font.

3. JavaScript: It is a programming language for the web that allows you to add interactivity and dynamic elements to your web pages. JavaScript can manipulate HTML and CSS.

Static vs. Dynamic Websites:

Static websites are simple and easy to create. They consist of HTML pages where the content remains fixed and doesn’t change dynamically.

On the other hand, dynamic websites are built using dynamic web pages that retrieve content from a database or Content Management System (CMS), allowing the content to change dynamically.

Domain/IP Address

A domain name serves as the address for your website. It is used to identify and locate computers on the internet. Instead of using numerical IP addresses, domain names provide a human-readable way to access websites.

2. Web Browsers

Web browsers are software programs that enable users to access and view web pages on the internet. They interpret and display content created with web technologies, such as HTML.

How do Web Browsers Work?

Web browsers take the HTML/CSS/JavaScript code of a web page and pass it to a rendering engine. The rendering engine parses the HTML document, converting elements into a tree structure called the “content tree.” This tree is then rendered, allowing the user to see the complete web page in their browser.

Rendering Engines

Different web browsers use different rendering engines:

3. Servers

Servers are computers designed to process requests and deliver data over the internet or a local network. In the context of web development, servers deliver data to web browsers.

Types of Servers:

There are various types of servers, including:

  • Web Server: Serves web pages.
  • Email Server: Handles sending and receiving emails.
  • FTP Server: Facilitates file transfers over the network.

Web Servers:

Web servers are programs that receive requests from web browsers and serve the files that create web pages in response to these requests. Examples of web servers include NGINX, Apache, and Microsoft IIS. Servers can also store data in databases.

Database:

A database is a software program that organizes information for easy access, management, and updating. Examples of databases include MySQL and MongoDB. There are two types of databases:

  • Structural Database: Follows a structured schema, often referred to as a relational database. It is highly organized and understood by machine language. Example: MySQL.
  • Unstructured Database: Allows the storage of unstructured data without a fixed schema. It can include textual or non-textual data generated by humans or machines. Example: MongoDB.

So now you are able to understand the Website, Web browser, and Server. Watch this video to know more about “How websites work?”

Getting Started with Web Development

1. Front-End Development

Front-end development, also known as client-side development, involves creating the HTML, CSS, and JavaScript components of a website that users directly interact with.

This practice focuses on converting data into a graphical interface. If you’re interested in a career as a front-end developer, it’s important to learn the following:

Core Languages:

HTML, CSS, and JavaScript.

Front-End Frameworks/Libraries:

Angular.js/Angular, Vue.js, React.js, and Bootstrap.

2. Back-End Development:

Back-end development also referred to as server-side development, involves the behind-the-scenes activities that occur when performing actions on a website, such as logging in or making a purchase.

Back-end developers primarily work with databases, scripting, and website architecture. If you want to pursue a career as a back-end developer, you should learn the following:

Core Languages:

JavaScript, NodeJS, PHP, Python, and ASP.net.

Back-End Frameworks/Libraries:

Express.js, Django, Rails, Laravel, and others.

Databases:

MySQL, MongoDB, and more.

3. Full-Stack Development:

Full-stack developers handle both front-end and back-end development, allowing them to work on projects involving databases, and user-facing websites, and even collaborate with clients during project planning.

In full-stack development, there are two common profiles:

MEAN Stack Developer:

MEAN stack developers work with the following technologies:

  1. M: MongoDB
  2. E: Express.js
  3. A: Angular
  4. N: NodeJS

MERN Stack Developer:

MERN stack developers work with the following technologies:

  1. M: MongoDB
  2. E: Express.js
  3. R: React.js
  4. N: NodeJS

MEVN Stack Developer:

MEVN stack developers work with the following technologies:

  1. M: MongoDB
  2. E: Express.js
  3. V: Vue.js
  4. N: NodeJS

Join TechFerment to expand your knowledge of various technologies and contribute to building solutions for the community.

If you have any questions or feedback, feel free to let me know in the comments! You can also connect with me on GitHub, LinkedIn, and Twitter. Thank you for reading, and I hope you found this information helpful.

Happy coding!

--

--

Vrijraj Singh

Google Developer Expert for Web Technologies & Firebase | Developer Advocate