Skip to main content

A road to glory of Web Development

Skip to:

  1. Week 1, Let's Get Started
  2. Week 2, ReactJS, A Game Changer
  3. Week 3, Learning Your Sidearms
  4. Week 4, Redux ToolKit - State Management made easy!
  5. Week 5, React Form Management Library
  6. Week 6, Rocket Science Behind the Web Server APIs...

Targeted Technologies: React and Node JS

We recognize the awesomeness of Javascript. Apart from it being the universal language for web we are a huge fan of ReactJS on client side and Node JS environment for server side.

Why Javascript stack?

First and foremost world lives in browsers so there isn't any way around it! But that's not it, Javascript has become a sane and automatic choice for client applications other than web, especially mobile as well as desktop. To make things even more interesting JS has become a sane choice on servers, IOT and even used in ML albeit for learning purposes.

If you want to look more into the "Why's?". Mr Google says "Hi!" to you and please keep asking Google till you believe that Javascript enables you to communicate with supernatural and extraterrestrial forces.

Still not satisfied? Please doubt your research skills!

Preface

You are a next level programmer, problem solver and algorithm designer. We acknowledge and respect that and it's not why you are here, you are here to fix colors and buttons(Pun intended :P). Humor aside, learning the tools to communicate and express awesomeness inside you, should be plain, simple and fast and which is exactly what this guide tries to do.

If you are expert at some topic beforehand then talk with your mentor and move on to advanced stuff. You don't have to be a "Lakeer ka faqeer" by following everything written here but when you say you know some topic we assume your understanding lies above 8/10 and to make it more interesting you will be tested accordingly.

This document will tell you what to learn, from where to learn and the practice assignments to do after you learn. The effort will be your own, what this document cannot do is, sit and code in your seat.

P.S. Motive of this manual is not to make you obey but to help you learn and if you think of any improvements, another effective procedure or a missing resource then please create an issue at this repository with the information and assign it to @ahmed.waleed. We are good people who appreciate feedback and suggestions, trust me :)!

Coding Prerequisites

You may think what's below this section isn't important for you but this is the stuff that usually differentiates between good and mediocre programmers. So, don't take this lightly.

Genius Programmer, How do You Become One?

We would love to say a few words on this subject however there is nothing we can say that could come close to this masterpiece video from two Googleans. It's a must watch and please do share it with your programmer friends as well!

Maintaining Standards of Code:

  1. Check out these Emumba coding [comandments], everything in it mayn't be relevant for you at the start, but that's okay you can study it as it becomes relevant through your training period
  2. Before any formal review, you should review your own code per the guidelines above and believe me, you will find lots of improvements plus this will make your mentor happy.

How to Share Code With Your Mentor?

Share the code on Facebook, Skype, Slack? Nah! That's not what real programmers do! It's been long since Git won the version control systems war and Github became the preferred choice for open source repositories and code.

If you have no idea what Git and Github is, see this and this or if you think that wasn't enough and need to solidify your understanding, you can watch this video series.

Still not comfortable with git and github? A lot of things are learnt at playground, let's see what this playground has to offer, will be fun!

Once you have enough understanding, here are the steps you need to follow

  1. Create a new repository for any assignment or task on Github
  2. Push your code to repo
  3. Add instructions on how to run or test the application in readme.md file
  4. Share the link to your mentor

How to do Code Improvements?

  1. Create a new branch with appropriate name(it's a test as well :)) and push the code to the remote branch on Github
  2. Add a new file named as Code Review (Markdown format preferred) and add the feedback / improvements suggested by mentor
  3. Open a merge/pull request back to the main branch however please don't merge it. Share the request with your mentor to review

Managing Yourself

Managing yourself and your time is immensely important to do work. And every successful person manages himself very well. This article by Peter Drucker is a must read by anyone working in any industry.

Editor Wars

In case, you are not aware of any modern text editors for WEB technologies (Yes! we see you vim users!), let us name a few and you can choose whatever sounds cool to you because they are all quite comparable.

The recommendation, however, is to choose an electron based editor so you can tweak it the way you want using technologies you work in i.e. HTML/CSS or JS.

  • Microsoft always impresses with tools for developers and this time its Electron based VS Code which is, surprisingly, open source, free to use and with a huge community echosystem and extensions. Plus i believe VS code can be declared as Emumba's official Editor because everyone i know uses it. Recommended by Author.
  • Atom is an Electron based open source Editor from GitHub with a lot of users and extensions. It's a sound choice if you hate microsoft for some reason.
  • Then, there is the Sublime Text which revolutionized the modern code editors. It is built on python so it is faster than the above two, with of course a lot of extensions. Downside to it is that it is not open source although it is free to use if you are okay with it bugging you sometimes to pay for it.
  • There are many others but the above three are the trending ones on tech scene and Cross Platform as well. Best editor is the one you are comfortable working in! You will spend major part of your day looking at your editor so make sure you like living in it!