A Simple Guide to Full Stack Development
Learning, Understanding, and Actionable steps to becoming a Full Stack Developer.
Introduction
A full-stack developer is a person who has the ability to build a complete application or website including both front and backend. In order to become a full-stack developer, you should be comfortable with using the three-tier architecture.
Along with three-tier architecture, you need to be comfortable with the process of debugging and searching for your errors online, and use the search engines and StackOverflow extensively.
Use breakpoints and debugger in Integrated Development Environments (IDE). Check your environment variables are configured correctly to avoid unnecessary messages from the spirit world to go home (I mean Errors 😢).
Presentation Layer
About
Front end: It is the visible part of the website or web application that is responsible for user experience. The user directly interacts with the front-end portion of the web application or website. It is also called the presentation layer.
Tools
HTML
HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content.
CSS
Cascading Style Sheets fondly referred to as CSS, is a simple design language intended to simplify the process of making web pages presentable. CSS handles the look and feel part of a web page. Using CSS, you can control the color of the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background images or colors are used, layout designs, etc.
Bootstrap
Bootstrap is a powerful tool that lets you quickly build attractive websites that look great on desktops, phones, and tablets. While there are some definite disadvantages to Bootstrap, in many cases, the benefits of website responsiveness, wide compatibility, and saved time will outweigh the cons.
Javascript
JavaScript (often shortened to JS) is a lightweight, interpreted, object-oriented language with first-class functions, and is best known as the scripting language for Web pages, but it's used in many non-browser environments as well. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles.
jQuery
jQuery is a fast and concise JavaScript Library created by John Resig in 2006 with a nice motto: Write less, do more. jQuery simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery Features. jQuery simplifies various tasks of a progammer by writing less code.
AngularJS
AngularJS is built around the belief that declarative code is better than imperative when it comes to building UIs and wiring software components together, while imperative code is excellent for expressing business logic. It is a very good idea to decouple DOM manipulation from app logic. This dramatically improves the testability of the code.
React.js
ReactJS is a simple, feature-rich, component-based JavaScript UI library. It can be used to develop small applications as well as big, complex applications. ReactJS provides a minimal and solid feature set to kick-start a web application.
Express.js
ExpressJS is a web application framework that provides you with a simple API to build websites, web apps and back ends. With ExpressJS, you need not worry about low-level protocols, processes, etc.
Typescript
TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. TypeScript is pure object-oriented with classes, interfaces, and statically typed like C# or Java. The popular JavaScript framework Angular 2.0 is written in TypeScript.
Application Layer
About
In a three-tier application, all communication goes through the application tier. The presentation tier and the data tier cannot communicate directly with one another.
The business logic, processing of the data coming and going to the presentation layer and data layer is handled on the application layer.
I visualize the application layer as the brain behind the operation whereas the data layer is the memory of the brain.
Tools
Express
Express is the most popular Node web framework and is the underlying library for a number of other popular Node web frameworks. It provides mechanisms to Write handlers for requests with different HTTP verbs at different URL paths (routes). Integrate with "view" rendering engines in order to generate responses by inserting data into templates.
Django
Django is a high-level Python web framework that encourages rapid development and clean, pragmatic design. Built by experienced developers, it takes care of much of the hassle of web development, so you can focus on writing your app without needing to reinvent the wheel. It's free and open source. Ridiculously fast.
Flask
Flask is a web framework, it's a Python module that lets you develop web applications easily. It has a small and easy-to-extend core: it's a microframework that doesn't include an ORM (Object Relational Manager) or such features. It does have many cool features like URL routing, and a template engine. It is a WSGI web app framework.
Laravel
Laravel is an open-source PHP framework, which is robust and easy to understand. It follows a model-view-controller design pattern. Laravel reuses the existing components of different frameworks which helps in creating a web application. The web application thus designed is more structured and pragmatic.
Spring Boot
Spring Boot is an open-source Java-based framework used to create a micro Service. It is developed by the Pivotal Team and is used to build stand-alone and production-ready spring applications. This chapter will give you an introduction to Spring Boot and familiarizes you with its basic concepts. Java Spring Boot helps you modularize apps and connect them to third-party services running in the cloud.
Rust
Rust is a multi-paradigm, general-purpose programming language designed for performance and safety, especially safe concurrency. It is syntactically similar to C++ but can guarantee memory safety by using a borrow checker to validate references.
Go
Golang is a procedural and statically typed programming language having a syntax similar to C programming language. Sometimes it is termed as Go Programming Language. It provides a rich standard library, garbage collection, and dynamic-typing capability. You can check out my blog on Introduction to Go here.
Java
Java is a widely used object-oriented programming language and software platform that runs on billions of devices, including notebook computers, mobile devices, gaming consoles, medical devices, and many others. The rules and syntax of Java are based on the C and C++ languages. One major advantage of developing software with Java is its portability.
C Sharp
C Sharp is a modern, general-purpose programming language that can be used to perform a wide range of tasks and objectives that span a variety of professions. C Sharp is primarily used on the Windows .NET framework, although it can be applied to an open-source platform.
Database Layer
About
A database is simply an organized collection of information, it can be structured or unstructured data. A database is usually controlled by a database management system (DBMS).
There are different types of databases depending on the type such as
- Model-based - Relational, Non-Relational (NoSQL), Object-oriented
- Location-based - Centralized and Distributed
- Design-based - Operational (OLTP), Analytical (OLAP)
- Hosting-based - On-premises, Cloud
- Processing Power-based - Personal, Commercial
Tools
MySQL
MySQL is the world's most popular open-source database. With its proven performance, reliability, and ease of use, MySQL has become the leading database choice for web-based applications.
PostgreSQL
PostgreSQL is a powerful, open-source object-relational database system that uses and extends the SQL language combined with many features that safely store and scale the most complicated data workloads.
SQLite
SQLite is an in-process library that implements a self-contained, serverless, zero-configuration, transactional SQL database engine.
MariaDB
MariaDB is a community-developed, commercially supported fork of the MySQL relational database management system (RDBMS), intended to remain free and open-source software under the GNU General Public License. Development is led by some of the original developers of MySQL, who forked it due to concerns over its acquisition by Oracle Corporation.
MongoDB
MongoDB is a distributed database at its core, so high availability, horizontal scaling, and geographic distribution are built-in and easy to use. MongoDB is free to use.
Redis
Redis is an open-source (BSD licensed), in-memory data structure store used as a database, cache, message broker, and streaming engine. Redis provides data structures such as strings, hashes, lists, sets, sorted sets with range queries, bitmaps, hyperloglogs, geospatial indexes, and streams.
Cassandra
Apache Cassandra is a distributed NoSQL database created at Facebook and later released as an open-source project in July 2008. Cassandra delivers the continuous availability (zero downtime), high performance, and linear scalability that modern applications require, while also offering operational simplicity
Popular Stack
This is just for your reference and by no means an exhaustive and exclusive list. You are free to make your own combination and experiment, learnings through this process of experimentation will be immense.
MEAN Stack
MongoDB, Express, AngularJS and Node.js, HTML, CSS
MERN Stack
MongoDB, Express, ReactJS and Node.js, HTML, CSS
Django Stack
Django, Python, and MySQL as Database, HTML, CSS
Rails or Ruby on Rails
Uses Ruby, PHP and MySQL, HTML, CSS
LAMP Stack
Linux, Apache, MySQL and PHP, HTML, CSS
Java Stack
Java, Springboot framework, HTML, CSS, Javascript, MySQL, or any other Database
Use Version Control
Work with the Version control systems which are software that helps track changes make in code over time. As a developer edits code, the version control system takes a snapshot of the files. It then saves that snapshot permanently so it can be recalled later if needed. Without version control, developers are tempted to keep multiple copies of code on their computers.
Git
Git is the most popular VCS and was built to work on the Linux kernel, meaning that it has had to effectively handle large repositories from day one. Check out my blog on getting started with Git.Tortoise SVN
TortoiseSVN is an Apache™ Subversion (SVN)® client, implemented as a Windows shell extension. It's intuitive and easy to use since it doesn't require the Subversion command-line client to run. And it is free to use, even in a commercial environment. You can check Tortoise SVN here.
Conclusion
Now, you have an understanding of what it takes to become a full-stack developer. If you feel overwhelmed with the number of stacks or you might be feeling that there are a lot of languages to learn to become one, don't be overwhelmed.
Actionable steps to become a Full-stack developer
- Choose one stack and start building.
- Start with building a simple form on HTML
- Add functionality to it using Javascript (Choose any)
- Beautify it a bit by using CSS, don't go overboard. Simple round edges some padding and changing colors will do just to get started.
- Build some logic to handle the data.
- Now you are venturing into CRUD operations.
- Think of a way to store your data.
- Build a database to store your data.
- Complete Create, Read, Update, Delete operation.
- Repeat the process but now with a bigger/more complex form.
Congratulations, you are on the path to becoming a full-stack developer. 😊✨
Keep practicing and All the best!