How to be a Kickass Developer: A Step by Step Guide
A Step-by-Step Guide to be a Kickass Developer
Table of contents
Hello Devs👋,
How many times you’ve started learning but due to lack of some wholesome roadmap, you gave up? Starting from scratch is not easy, It takes a lot of courage to start, but again as much as it requires courage to start the route is also important, a roadmap shows you a straight path, without a bit of distraction. It helps you focus on ht bigger picture and reduces the noise.
If you want to become a web developer and wondering what you should learn to become a professional web developer, but are not sure about where to start or looking for a roadmap, then you have come to the right place.
With so many languages, frameworks, and libraries to choose from, often beginners find themselves scratching their heads about how to start off their development journey.
In this article, I am going to share some of the most essential things a developer should know.
I often receive questions like
- What tools and technologies should a web developer learn?
- How to start front-end development?
- Which programming languages are suitable for back-end development?
- What are the required skill-sets to be a developer?
- How to start backend development?
- How to be a full-stack developer?
- How much time does it take to be a successful developer?
I am going to answer all those above-mentioned questions. This is based upon my own practical experience and contains the most essential thing to be a kickass developer. 🤩
Types of Developer 💻
Here comes the most important part which field you should choose. To be honest, all of these fields are good but all go deep down to what you wanna do and for that, you need to be aware of each of them.
When users click on a website link, such as a “Pay Now” button, they rarely think about the underlying code that takes them to a payment page. Web developers are responsible for creating the look and feel of that button, as well as the logic that drives the website.
Here are the three main types of web development:
Front-End Developer
A Front-End Developer is responsible for developing the client side of a web application that users interact with. This includes a site’s layout, design, and the way users interact with it.
They focus on rendering websites with user-friendly interfaces. Usually, they tend to work with HTML, CSS, and JavaScript to build the UI/UX of a website.
Front-end work is both creative and analytical. It often requires problem-solving and attention to detail.
You have to have a keen eye for detail to make sure that your code is clean and that your layout is neat.
Back-End Developer
A Back-End Developer works on the “server-side” of web development. This is focused on the way a website functions and can include databases, servers, networks and hosting, and more.
They are responsible for making sure that the site or app works correctly and scales as the company grows.
Back-end developers use frameworks like PHP, Node.js, Java, or Python. They also work with databases like MySQL, MongoDB, or PostgreSQL.
They work with data, design, and architecture, and solve problems at scale.
Full-Stack Developer
A Full-Stack Developer is someone who works on the cross-functionality of the web application and is familiar with both front-and back-end development.
In addition to mastering the frontend skills like HTML and CSS, they also know how to write a logical program PHP, Java, Python, or Node.js.
They design, develop, and maintain fully-fledged and functioning platforms with databases or servers.
Full Stack developer offers the full package of development ie. both front-end and backend.
Learning Path 🛣️
By now you have come to know how many types of developers are there and I'm Pretty Sure, you must have also got to know who you want to be.
Let’s go dive into the process. 👇
1. Getting started with the web
In the world of web development, you don’t need to remember & everything, but be aware of things. Whether you’re a front-end dev backend dev or full-stack dev, below I’ve mentioned some of the topics you should be aware of before starting into the web.
- What is the Internet and how does it work
- HTTP & It’s Protocols
- Web Browsers & how they work
- DNS
- Domain
- Hosting
2. Frontend Development 🚵
Frontend development is how we build user interfaces for the web. You must have a strong foundation in JavaScript as well as an understanding of how HTML/CSS work.
HTML
This is the first and foremost thing web developers should learn. It is the standard markup language to specify the structure of your page. & display web pages in a web browser. HTML is easy to learn and use.
- Learn the basics
- Semantic HTML
- Forms & validations
- Conventions & Best Practices
- Accessibility
- SEO Basics
Resources
CSS
Cascading Stylesheets (CSS) is the code that you use to style your website. For example, do you want the text to be black or red? Where should content be drawn on the screen? What background images and colors should be used to decorate your website?
- Learn the basics
- Floats
- Positioning
- Display
- Box Model
- CSS Grid
- Flexbox
- Responsive Designs
- Media Queries
Resources
JavaScript
- Syntax & Basics
- Dom Manipulation
- ES6 & Modular JS
- Fetch API/Ajax
- Learn about hoisting, event bubbling, scope, prototype, shadow DOM, strict
Resources
- Intro to JS
- Object-Oriented JavaScript
- JavaScript Design Patterns
- Learn JavaScript - Full Course for Beginners
- Intro to AJAX
- The Modern JavaScript Tutorial
- JavaScript DOM Crash Course - Part 1
- JavaScript DOM Crash Course - Part 2
CSS Frameworks
- Bootstrap/Bulma/Materialize
- Tailwind CSS
Note: if you’re a very beginner, start with Bootstrap then after that Learn Tailwind CSS.
Resources
- Bootstrap CSS Framework - Full Course for Beginners
- Learn Bootstrap in less than 20 minutes - Responsive Website Tutorial
- Tailwind CSS Tutorial for Beginners - Full Course
CSS Preprocessors
- Sass/PostCSS/Less (Sass is recommended)
Note: Start with SASS, easy to learn and understand
Resources
JavaScript Frontend Library/Framework
- React/Angular/Vue (React is recommended)
Resources
3. Backend Development ⚒️
Backend development refers to the server side of an application and everything that communicates between the database and the browser. The primary responsibilities of a backend developer are making updates, and changes and monitoring a site's functionality. The backend is where you communicate with the database, handle business logic, and send the necessary data to the front end.
So, in this backend developer roadmap, we will discuss technologies and tools that are important for becoming a good backend developer.
Basic Internet, OS, and Frontend Knowledge
- Basic of HTML, CSS & JavaScript.
- Basic Terminal Commands
- Networking Concepts
- How OS Work
- Process Management
- Memory Management
- I/O Management
- Threads & Concurrency
Resources
Programming Languages
First and foremost, Developers generally have to be trained in any of the programming languages available for backend development. This is the most important part of being not just a backend of any developer. Some examples are given below:
Backend Frameworks
Backend frameworks are the libraries of server-side languages that aid in building the server configuration of any website. It is essential to use the right technology to develop websites or seriously affect your application usage.
Backend development frameworks are essential skills. This is because they allow for the development of templates and code that might be used in the future.
They also reduce the amount of code you have to write which makes programming more efficient.
Some common frameworks used in backend development are:
- Laravel
- Spring Boot
- Django
- Express
- Rails
Resources
Databases
The database is responsible for storing data and accepting queries. It then collects information, sorts it, and returns a detailed answer to the application.
There are two common types of databases — SQL and NoSQL.
Relational Database (SQL)
NoSQL
In addition to learning about the above databases, you should be familiar with the basic concepts of relational databases, such as
- ORMs
- ACID
- N+1 problems
- Data normalization
- Transactions
- Indexing
Resources
API
API stands for Application Programming Interfaces.
It is an intermediary between the applications that rely on each other to work together. APIs are used to ensure connections between different applications and services, and in turn, offer an improved user experience on the front end.
Some of the common APIs that you should be familiar with as a backend developer are:
- REST
- JSON
- SOAP
- GSON
- XML-RPC
- AES
Resources
Caching
Caching is the process of saving a copy of a resource in a cache form so that it can be quickly brought forth when requested.
The main goal of caching is to increase the performance of data retrieval while minimizing the need to obtain the underlying hoarding layer, which is very slow to process.
The caching techniques and tools that one should be aware of are:
- CDN
- Server Side
- Redis
- Memcached
- Client-Side
Resources
Web Security & Communication Protocols
- IPsec - Internet Protocol Security
- IKE - Internet Key Exchange
- SSH - Secure Shell
- SSL - Secure Socket Layer
- HTTPS - Secure Embedded Web Server
- RADIUS - Remote Authentication Dial-In User Service
- TLS - Transport Layer Security
- SET - Secure Electronic Transaction
- PEM - Privacy Enhanced Mail
Resources
Testing
Backend testing is the procedure of checking the database or server side of the web application. Backend testing determines whether the database layer is efficient, without any data corruption or loss.
The testing methods that backend developers should be aware of are
- Integration testing
- Unit testing
- Functional testing
Once a developer always a developer
Besides these, one should also learn about
- Design & Development Principles
- Architectural Patterns
- Elastic Search
- Containers & Virtualization
- Web Sockets
- Web Servers
- Scaling
Learning is a never-ending process.
With the never-ending advancement in tools and technologies, you can always collaborate with new techniques that are used in backend web development and always try to upgrade yourself with the latest tools & technologies available in this domain.
4. Version Control System
A version control system is a tool that helps both the backend and frontend developers collaborate and control the changes made over time.
A version control system also gives details about what kinds of changes should be made and by whom.
Therefore, a version control system enhances the project speed by allowing developers to interact, remove the possibility of errors, and recover the code if any accident occurs.
The following version control platforms are often used for backend development.
- Git
- GitHub
- GitLab
- BitBucket
Resources
5. Some Additional skills to possess
No matter what path you chose, be it Front-end, back-end, or Full-Stack, there will be always a few skills that a developer must possess.
- SSH- Secure shell protocol is used to operate network services securely over an unsecured network. SSH provides a secured remote login from one computer to another. It ensures the privacy and integrity of data.
- HTTP- HyperText Transfer Protocol (HTTP) is the protocol used by the world wide web. It defines how messages are transmitted and how actions are taken by web servers and browsers when responding to commands.
- HTTPS - is the secured version of HTTP. Here, the communication protocol is encrypted using Transport Layer Security. It ensures protection against man-in-the-middle attacks and eavesdropping.
- Linux commands- line basic-Although it is not mandatory that you possess this skill, it is good to know about Linux. It is not necessarily easy or hard to learn. Linux makes the job easier and saves a lot of time by organizing items on the backend.
- SSL - SSL Stands for the secure sockets layer. Protocol for web browsers and servers that allows for the authentication, encryption, and decryption of data sent over the Internet.
- Data structures and algorithms: Data structures are different ways of storing data, while an algorithm is a generic approach methodology to solve a problem or requirement. Every programmer needs to be familiar with these concepts. These are not core skills, but the more intuitive you are, the easier it is to solve issues or add requirements.
- Cloud computing - Cloud computing is a general term for anything that involves delivering hosted services over the internet. eg. AWS, Azure, Google Cloud
- Deploying to the Server: It means copying a file or set of files to another machine or to another folder, depending on the requirements, simply pushing your code to production.
6. Full Stack Development 🌝
If you successfully followed all the steps above, you’re almost there, just that if you decide to build a product, Congratulations You’re a Full Stack Developer now. 🎉
Just Follow the above-mentioned steps from Step 1 to Step 5 😋
Build Proof Of Work
Now, this is the time, when you’ve to build projects and implement your learnings while solving real-life problems. That will eventually help you in clearing concepts and make you job-ready.
For eg, if you’re reading a tutorial on how to build a discord bot with JavaScript, try building your own bot.
You’ll be doing two great things for your career at the same time:
- Practicing and honing transferable skills.
- Building your Proof Of Work with actual case studies and proofs of concept.
At this point following tutorials is not important anymore.
What matters is progressing on projects and learning how to solve problems as they show up.
Career Options as a Developer
Be it a Front-end Developer, Back-end Developer, or Full stack Developer, there is n number of opportunities available in the market it’s just you’ve to be good at what you do and look for an option that suits your need and skills.
- Internship
- Job
- Freelancing
- Apart from this, you can be a technical founder in a SaaS Product, or you can build some side hustle and make money out of it.
Land Opportunities
Landing opportunities be it an internship, a job, or a freelance gig, will always be your ultimate goal, and just learning is not sufficient, getting your dream opportunity is a battle in itself. You can never avoid this battle but can make the process easier by following this guide. Guide to land your first opportunity
Food For Thought
The web keeps changing and with advancements in technologies comes new methods and tools. So, it is essential to keep yourself up-to-date with the latest trends and technologies, and never stop learning.
It doesn’t mean that what you have learned so far will be of no use. Your basic knowledge will always be an advantage for your career. But you must keep updating your skills for better growth.
Don’t hop to different frameworks, double down on what you already know.
Stay Focused 🤘
If you’ve any questions you know where to find me.
Happy Coding 🧑💻