Take This With You: The Minimalistic Web Developer Self Care Kit
How to get unstuck, solve problems and stay healthy as a developer
This article is a collection of principles and helpful resources for web developers. Hope you find something helpful to you!
Docs and websites in this article will be updated frequently
Last updated on 2022-11-10 09:50 UTC
Always Be Learning, Always Be Seeking
As web developers we need to learn. A lot. And it's not just learning, we also need to stay on top of new technologies and keep practicing.
Learning Resources
-
The Odin Project is one of my favorite resources to learn web development. What makes odin unique is that they do not hold your hand and walk you through. They give you the tools and you use them to learn, you set up your own development environment. In my opinion Odin prepares you to be a developer that can learn any new technology on their own. This is a very powerful and important skill.
-
freeCodeCamp is great for newbies. I recommend it to everyone that is just starting out with programming in general. The lessons are pretty integrated and most of them can be done in the browser at the beginning stage.
It is also a good challenge to do Odin and freeCodeCamp simultaneously. Best of both worlds.
-
Frontendmasters is one of the best out there. In there, you will have the true masters of their craft teaching you front-end engineering. Highly recommended for all web developers from beginners to seasoned experts.
If you are a student and eligible for Github Student Pack, you get 6 months free on this platform! More info on frontendmasters' website and github student pack
They also have a completely free bootcamp for total webdev beginners where they teach the very basics of HTML, CSS and JavaScript. Check it out on their website
-
LearnWeb3DAO is created by wonderful Kacie Ahmed and Haardik, they helped lots of people get into web3 with their program.
LW3 is great for everyone. You do need to have some programming experience but other than that there are no hard requirements. If you have little to no experience with web3 you can start right at their freshman track and move on to sophomore, junior and senior.
I am about to finish Sophomore and I can say that lessons are pretty good paced and you get to build stuff!
Alchemy's Road to Web3 and upcoming Alchemy University
Practice, Practice, Practice
It is undeniable that we need to practice to get good at programming, frameworks and everything in between. There is not a single person in the world that is good at a new skill without practice. That is why you should visit these sites frequently and keep your skills sharp!
-
Codewars has "kata". Which are basically programming problems. You can code the solution in their web editor and get integrated TDD (test driven development) out of the box.
As you solve kata, you will progress to more difficult ones and earn ranks. This is an example of mastery learning.
-
Leetcode has lots of challenges in all difficulties. This is a good platform to prepare for dreaded technical intervews as you will find challenges and interview questions here.
-
Hackerrank is also great for preparing for interviews. They are more structured and hackathon-like compared to Leetcode. Definitely recommended.
-
Project Euler is one of my favorites. All of the problems are math problems. Don't let that scare you though, this is great for thinking with numbers. Check it out!
-
If you want to learn a new language, get some practice and receive feedback then Exercism is just for you.
It has more than 60 languages. With their guided track you learn and solve problems. After solving the problem you wait for feedback from the community mentors. After the mentor approves your solution you move onto the next problem. I found it very helpful while learning JavaScript, Rust and Bash.
-
Frontend mentor gives you website templates to create with your tech stack. It is great for web developers to get some real practice.
-
Learn web3 by doing cool projects. Prior programming experience required.
-
Gamified smart contract education, it's pretty cool.
Read The Documentation, Please!
When in doubt, hit the docs!
Often we make mistakes because we didn't read the docs and do not know what functions are there and how the api works - the list goes on and on!
Here are some wikis, docs and websites I visit frequently.
- freeCodeCamp
- The Odin Project
- MDN by Mozilla
- Devdocs -> massive collection of API Docs and more!
- React Docs
- React Beta Docs is mostly complete, looks better and is more accessible
- The good old React docs
- NextJS Docs
- Arch Linux Wiki -> Best wiki for all linux users
Join A Community
Learning and truly mastering web development is a long journey. You will often be frustrated, things will stop making sense. There will be errors on line 43 while your code is 42 lines long...
In a community you can ask questions, help others and grow together while having a feeling of belonging. Quoting this page by odin project
When you’re slogging through the desert of despair, where your code doesn’t work or even make sense to you anymore, you can find an oasis of knowledge and encouragement in our community. Veterans at The Odin Project love to help fill in knowledge gaps and provide new insights and perspectives on how to improve your code. We’ve all been there before!
Here are some of the communities I am in:
4C (Cool Community of Content Creators) by Francesco Ciulla
4C is for content creators, newbies, seasoned developers and even github stars. Highly recommended!
[Developer Dao]
Developer Dao is a community that is very important to me. It is founded by Nader Dabit and other awesome people like Will Kempster. They started out when web3 hype on twitter was at the peak last year. This community is token gated but I guarantee you it is worth it. When I joined last year, minting the genesis NFT, I was sponsored by a kind benefactor. I am forever thankful for that.
My hopes are up with D_D!
-
This is the community discord for the udemy course the web developer bootcamp.
This list will be updated.
Ask Questions
How do you ask questions when you get stuck?
Like this?
Hi, is there anyone that knows React here?
Please do not ask to ask. It doesn't help anyone, it just burdens the people who want to help you. Tell us what are you working on, what have you tried and of course what is the expected behavior?
Something like this would help everyone.
Hi, I started learning react a couple days ago and I was trying to implement a custom hook to get window dimensions but it does nothing when I use it. It should return the window dimensions as shown in width and height but I keep getting an empty array.
Don't Burn Out
The internet is full of docs, tutorials, js frameworks and everyhing in between. With so many information sources it is easy to get overwhelmed and eventually burned out.
Take Breaks
We often get very absorbed in what we do. I'm sure you had that moment of bug fixing that went on for hours uninterrupted with no results and feeling tired.
Well, taking breaks is better than you think. This is because your brain continues to work on whatever you were doing, whether it is fixing a bug or learning a new JavaScript framework. Let's take a look at how we learn and focus.
There are essentially two modes of thinking/learning/focus in our brains. Diffuse and Active.
Active mode is better mentioned first because we all know what it is. Active mode of learning is when you are actively focusing on an issue or learning something actively. In this mode your focus is like a laser, hence the term laser-focused. This laser strikes straight to the target.
But the magic is with the "diffuse" mode of learning.
I want you to imagine two things. One is your focus. In this mode your focus is not a laser. It is a cloud that can encapsulate ideas, concepts, problems and stuff like that. The other is a vast sea of stars. Infinite stars glowing amidst the darkness. You got it? Good. Those stars are the ideas, memories, concepts, every problem you had and of course your previously active-focused items.
Diffuse mode is a super power. You can't enter this mode by actively focusing on something. To use the diffuse mode you can:
- Take a break
- Go on a walk
- Have a nap
- Do chores
- Make coffee
- Sit idly
- Meditate
Do you see the pattern here? The diffuse mode is when you focus diffusely. When you go on a walk, your focus spreads over the your sea of consciousness and starts working on it. What is really amazing is that this is the exact time your mind combines lots of concepts and cements your learning. It is impossible to do this with active focus because you just can't see and connect to other concepts and problems as well as in the diffuse mode. This is how to learn better and this is why you should take a break.
To learn more about learning please check out Barbara Oakley's free course on her free coursera course where she talks about what I explained above and much more!
Stay Healthy
As taking breaks help you solve things from new perspectives, staying healthy allows you to have the capability to do so in the first place.
Some tips to stay healthy
- Get enough sleep. It could be 6 to 8, depending on your physiology.
- Eat healthy.
- Stay active physically.
- Posture is important. Learn how to sit correctly.
Thanks for reading! Please let me know in the comments if there is anything.