DEV Community

loading...
Cover image for Learn Fullstack | 2021

Learn Fullstack | 2021

Anguram Shanmugam
Be Good On Doing
ใƒป5 min read

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

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!

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

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

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.

Frontend

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

w3schools is the best resource for newbies. But if you wanna be sassy๐Ÿ˜Ž in it. Here are my recommendations.

Some CSS related link will help in learning process

For JavaScript

Wanna get more sassy!

  • use MDN for everything ๐Ÿ˜‚ MDN Docs
  • 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

Knowledge is power

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:

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.

Database side

Kill me
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

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

Discussion (8)

Collapse
ri5hirajp profile image
Rishiraj Purohit

One thing I'd like to highlight is learn why behind the things as that will help you understand the choices you made.

For backend try to learn the general approach of a feature. For example, changing password ? User should be authenticated, use current password then , maybe confirm the new password and save to database .

Even more general will be understanding the flow, request , get input , validate , create model if not exist and then save to database.

Because once you know that you have to validate , finding out how to validate would be simple in any language or framework.

As you grow, you will find more complicated stuff like

  • notifications (polling vs push)
  • events (pub-sub vs message broker)

I understand your feelings towards backend , I am kind of doing the reverse were I started with backend but now trying to improve my frontend skills.

Collapse
Sloan, the sloth mascot
Comment deleted
Collapse
retr0c0de profile image
Anguram Shanmugam Author

Don't buy his book ๐Ÿ˜‚

Collapse
retr0c0de profile image
Anguram Shanmugam Author

Please don't promote your stuffs in my comments section. This article only recommends free resources available.

If you're keen. Please I recommend to respect the post and delete the comments.

Collapse
dthomason profile image
David

I like how you offer concepts on how to approach the mental barriers that come along with learning this stuff. I think it would be more affective if you stuck with that instead of product name dropping and recommending. None of that stuff matters when youโ€™re a full stack developer. What matters is being able to truly visualize how youโ€™re going to perform a task or feature utilizing the components as vehicles to make it happen. I like the card analogy, but I tend to think in ways of like an assembly line in a car factory. If everyone working the factory actually knows how to build a car regardless of the tools, then the objective gets done because no one is standing around saying itโ€™s not in their job description. I can hop any where in the stack and contribute to the goal. It could be a language or product Iโ€™ve never heard before and when itโ€™s go time Iโ€™m gonna get it done. Not because Iโ€™m a badass ass, I wish, I just like to build things. Legos, cars, apps, life, itโ€™s all the same process at the end of the day.

Thin vertical slices, keep it small brain, compartmentalize each piece into testable, teachable, flexible, objects, until finally all the pieces are in their places. Then as you step back in wonder at your achievement you accept the fact that 3 months from now youโ€™ll see something you wrote and be like, what was I thinking?!! This is trash. ๐Ÿ˜‚๐Ÿ˜‚๐Ÿ˜‚๐Ÿ˜‚

Collapse
cjsmocjsmo profile image
Charlie J Smotherman

What no mention of flutter or blazer? They seem like interesting alternatives to html css and javascript.

One code base and you compile to the web, windows mac and linux desktop, android and ios mobile.

Just started my trip down the flutter rabbit hole but so far it lives up to the hype

Collapse
andrewbaisden profile image
Andrew Baisden

Good post!

Collapse
lmendev profile image
Luis Mendoza

Great post! Keep going ๐Ÿ’ช