Learn Fullstack | 2021
Tags: webdev, fullstack, javascript, typescript
Published: 2021-05-19 04:32:09

This article focus on Fullstack web development. So, Don't blame me for the "anaconda article".

If you're not using React or using Angular/Vue. It's totally fine and will be compatible for you. You can start with idea and gist that I provide. Then Ladder up your skills with your taste 😉.

let's begin 🚀
![Laugh at your time](https://media.giphy.com/media/QxePySHSUR97cXmCH0/giphy-downsized.gif)

# Fullstack web development
#### According to W3Schools:
A full stack web developer is a person who can develop both client and server software.

In addition to mastering HTML and CSS, he/she also knows how to:

- Program a browser (like using JavaScript, jQuery, Angular, or Vue)
- Program a server (like using PHP, ASP, Python, or Node)
- Program a database (like using SQL, SQLite, or MongoDB)
![Thats what she said!](https://media.giphy.com/media/5kFJkMhfOnQ02VdkHy/giphy-downsized.gif)

But If you ask me. An fullstack devloper is a "wizard" in web dev universe. Because you can do literally everything from backend to frontend. So, Enough about the inaugurals.
![Fullstack Freakin Dev](https://media.giphy.com/media/5wWf7H89PisM6An8UAU/giphy-downsized.gif)

# Learning Curve
There's a gotcha though i.e. the "Learning Curve". It's High if you look as a big picture. The first thing is to breakdown/compartmentalize your stack(Stack is nothing but like a stack of cards. But here each card is each tech e.g. React is an Tech in your tech Stack.)

People will usually tell don't start with library or framework. Just start with Plain HTML, CSS, JAVASCRIPT.
![Mop the floor first](https://media.giphy.com/media/x54JG1A3WEzvEpsUuK/giphy-downsized.gif)

Of course, It's crucial to have a crisp knowledge on Fundamentals. Because the reason is very simple. End of the day you'll be working on a Enterprise. In which you probably work for your company on a budgeted project. So, All your knowledge will be compromised for their requirements. You may learn in way that suits you. But it won't fit on their belts and they'll shape it according to their needs. For example: You learn modern database system. But what if your project have that old SQL system. will you fit in?

The thing you missed probably is 'Standard'. The more standard you're, The more flexible you'll be. So, immediatly don't start from Assembly language😂. Just keep this in your mind. You'll know these in long run.

# Checkpoint Reached
If you're this far. congratulations🙌. You have the patience to master the full stack.
![](https://media.giphy.com/media/5wWf7GW1AzV6pF3MaVW/giphy-downsized.gif)

## Frontend
If you're a beginner and new to programming world. Start with HTML, CSS, JavaScript.

[w3schools](https://www.w3schools.com/) is the best resource for newbies. But if you wanna be sassy😎 in it. Here are my recommendations.
- [DevDreamer HTML Playlist](https://www.youtube.com/playlist?list=PL7TLF4T4Tq2RNvYzF45yOeFi-O1KRAWtu)
- [DevDreamer CSS Playlist](https://www.youtube.com/playlist?list=PL7TLF4T4Tq2RCWa-ZRkEWXVtXteyZ2CjK).
- [css-tricks](https://css-tricks.com/guides/)

## Some CSS related link will help in learning process
- [css-tricks](https://css-tricks.com/)
- [cubic-bezier](https://cubic-bezier.com/#.17,.67,.83,.67)
- [CSS Grid](https://cssgrid-generator.netlify.app/)
- [CSS Flexbox](https://flexboxfroggy.com/)
- [Atomic Layout](https://redd.gitbook.io/atomic-layout/)
- [CSS Gradiant](https://cssgradient.io/)

## For JavaScript
- [JavaScript.info](https://javascript.info/) Beginner Friendly
- [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript)

## Wanna get more sassy!
- use MDN for everything 😂 [MDN Docs](https://developer.mozilla.org/en-US/docs/Web)
- Learn TypeScript for making better JavaScript codes 

Now you're strong enough to survive in web-dev-world. But that's not enough. why?

## Frontend Framework
However we're going work with more and more pages and logics right?

So, we need some tools or heavy-lifters to get things done in a organized and maintainable way for long-run. So, we're going to use library/Framework in it.

Here comes the problem of 'This or That'. 
 - Which framework library should I learn?
 - Which is best?

The question is more like Batman or Ironman, Superman or Thor. Each of them is best in their universe. So, It's not necessary to stick with one. Also remember, End of the Day it's all corporate.

`Don't put all your apples in one basket! - EDWARD SNOWDEN`

If you're beginner. Not in programming, But in web dev. Start with React. Since, it has good community and learning curve too simple. Once you got the hold. Try Vue, Svelte, Gatsby, Next.js, etc,.

Checkout this youtube channel. It's awesome "one stop shop" for React:
[CODEVOLTION](https://www.youtube.com/channel/UC80PWRj_ZU8Zu0HSMNVwKWw)

![Knowledge is power](https://media.giphy.com/media/XYrHWGJPtaQMM/giphy.gif)


## Backend
oof! finally the second-half 😒`kill me right!`

Here's the another 'This or That'. 
 - which language for backend?
 - Is node.js is secure like java, Python?
 - SEO, ORM, blah blah.

😂 This is were I stuck myself for long time. It's a black hole if you're learning on your own. 

The only way is start with one. Once you got the rhythm then learn new things. Have a standard knowledge about one thing(helps you in crucial scenario).

My recommended resource for NodeJS:
- [Node.js with REST_API](https://www.youtube.com/watch?v=TNV0_7QRDwY)

## API is the most vital part
`NOTE: You don't really need to learn Database side to learn BACKEND just know why's and what's. when you're doing things that you do!`
Learn graphql because most of the enterprises moving from REST to GraphQL. It's more like JQuery thing!. 

GraphQL is simple when you keep things simple.
- [HowToGraphQL](https://www.howtographql.com/)
- [GraphQL Docs](https://graphql.org/learn/)

## Database side
![Kill me](https://media.giphy.com/media/3o6UBgDNiVZHmypHuU/giphy.gif)
`I know it's killing you already. But com'on guys!`

You may pick whatever you want. Unless or untill your boss thinks that you're a moron😂. Yeah that's true modern database can do anything. 

For example: If you see SQLite. It store every data not as traditional table format but as files.
But If you proposed this idea to an enterprise which has terabytes of data!. you'll be kicked out of the office right away. I'm not trolling SQLite 😅😅😅 anyway some enterprise using SQLite.
![They're just jokes](https://media.giphy.com/media/YMdekbXhqGkyyn048e/giphy-downsized.gif)

My Recommendation is Go for MongoDB or PostgreSQL. Both awesome, beginner friendly, had good community support.

After learning all the above go for these link: https://fullstackopen.com/en/

It's an anaconda article, I know. But I need to make sure that the content I provide is pretty good and meaningful.

Have a blast🎉. Never get tired. If you got just watch something that get you out of the box for sometime!
![IDC](https://media.giphy.com/media/IffwQuk0uYwOIJEpon/giphy-downsized.gif)