This post summarizes some aspects on web development.
Web Development Basic Learning Path
If you want to learn web development, the increasing knowledge you need to get could be summarized as below:
- HTML
- CSS
- JavaScript
- CSS Frameworks
- DOM
- Code Repositories
- Web Front End Frameworks
- Web Back End Frameworks
- API
- Database
- Content Management Systems (CMS)
1. HTML
HTML is a markup language to build website. It provides the layout and content (text, images, etc.) of a website.
In the early internet, websites were done directly in HTML. However, now there are many tools and framework to avoid going to such a low level.
Nevertheless, it is important to know the basics of HTML.
2. CSS
CSS is used to configure the visual aspects of a web, like fonts, font sizes, style, colour, etc.
As it happens with HTML, developers no longer need to deal directly to CSS and use CSS frameworks instead.
In any case, it is useful to know the basics of CSS.
3. JavaScript
HTML and CSS are mostly used for visualization, but they lack the functionalities that a programming languages offer.
JavaScript, frequently shortened as JS, is a programming language for webs. While HTML provides the layout and content and CSS the format, JavaScript enables adding logic procedure to the web.
HTML5 is a compound of HTML, CSS and JavaScript technologies. Up to this point, we would have the basics to build a web page. But if we expand our knowledge and tools, we can create better webs and faster.
4. CSS frameworks
Some examples of CSS frameworks are Bootstrap and Tailwind CSS.
You can find a detailed list of CSS frameworks on this post.
5. DOM
Document Object Model (DOM) is a cross-platform and language-independent interface that treats an XML or HTML document as a tree structure wherein each node is an object representing a part of the document.
DOM is a programming interface for web documents. It represents the page so that programs can change the document structure, style, and content. The DOM represents the document as nodes and objects; that way, programming languages can interact with the page.
The most common way to access DOM is through JavaScript.
6. Code Repositories
Some examples of code repositories as a service are GitHub and GitLab.
You can find a detailed list of code repositories as a service on this post.
7. Web Front End Frameworks
Some examples of web application frameworks are React, Angular or Vue.
You can find a detailed list of web application frameworks on this post.
8. Web Back End Frameworks
Until this points we have been checking the parts that are run on the client’s browser. But there are some functionalities that can must be run on the server side. From now on, we are entering into this area.
Some examples of web server environments are Node.js, Django, Ruby on Rails or Express.js.
You can find a detailed list of web back end frameworks on this post.
9. API
An Application Programming Interface (API) allows communication between systems.
Integration with other systems is one important feature of the back-end of a website.
You can read more about APIs on this post.
10. Database
Accessing a database is an important back-end functionality.
You can read more about databases on this post.
11. Content Management Systems (CMS)
without the need for direct server-side scripting.
Some popular CMS platforms:
- WordPress
- Drupal
- Joomla
You can find an introduction to WordPress on this post.
Web Development Advanced Learning Path
Some advanced web development topics:
- Serverless Architecture
- Containerization and Orchestration
- Microservices Architecture
- WebSockets
- Static Site Generation
Serverless Architecture
Serverless architecture allow developers to run code in response to events without the need to explicitly provision or manage servers.
You can read more about serverless architecture on this post.
Containerization and Orchestration
Technologies like Docker and Kubernetes allow developers to package and deploy applications along with their dependencies in a consistent and isolated environment.
You can find more information about it on this post.
Microservices Architecture
Microservices architecture implies breaking down a monolithic application into smaller, independent services that communicate with each other. Each microservice can be responsible for specific functionality.
You can find more information about it on this post.
WebSockets
WebSockets are real-time communication protocols that enable bidirectional communication between clients and servers, allowing for more interactive and real-time applications.
You can read more about WebSockets on this post.
Static Site Generation
Tools like Jekyll, Hugo, and Gatsby generate static HTML pages at build time, reducing the need for server-side processing for certain types of websites.
Web Management
Web management would be above web development, and it comprises all aspects related to a website, not only the technical ones offered on this post.
One part of web management is marketing.
You can read more about web analytics tools on this post.
External references
- Durga Prasad Acharya; “Django vs Laravel“; Kinsta