Basic Front-End Development Tips for Students

Introduction

There is a lot of chit-chat about programming nowadays, about this magnificent job that makes you cool and grants you some amazingly magical powers that transform you from a pussycat into a real lion. The legend says that to be a real programmer you have to follow a long list of golden rules (known also as style guides). Such a controversial list, that in the end, you will write code in assembler only to escape the cruel reality. I wasn’t able to find that list, all I've heard about it is that as a programmer you get extra cool points for the beard. But fear no more, as Murphy's law is saying: If at first, you don't succeed, read the manual.

Don’t think of yourself as a superstar, you’re not one and you’ll never be. I'm not telling you to be a mediocre “machine" that follows blindly the orders, but you have to stop thinking about yourself as if you are this cool person who knows a lot but doesn’t tell anyone anything and doesn't owe anything to anyone. You need to stop thinking of yourself as being the alpha and omega and that the sun should stop to listen to you. 

This is metaphorically speaking … bullshit. To achieve greatness, you have to put yourself through hard work! You have to punish yourself for your mistakes, you have to push yourself every day to do something that you hate (sometimes) but you know that is good for you. That means work, that means to be a programmer, in fact, that means to be a human being in general. Otherwise, you are just another "dude" that is constantly looking for bacon to shove in his mouth. I do love bacon though, isn't' it amazing how satisfying it feels in your tummy?

In order to achieve greatness you have to put yourself through hard work!

Anyway, on another note, BRACE YOURSELF, THE INTERNSHIP IS COMING. I was thinking long and hard about this, well not that hard, but long enough to write this little article. You are a student and you would love to be a web developer! Namely love not to like! If you would like to be a developer then just drop it, it’s not for you, you have to LOVE this thing. So if you would love to be a Front-End Developer specifically, then my friend, by the powers invested in me by Google Search and Stack Overflow, I will try to give you a small, but hopefully useful list of links that you can checkout and prepare yourself with the basics of front-end development.

You should really love not like, if you would like to be a developer then just drop it, it’s not for you!

The 3 basic pylons of web development

A fast reminder, the 3 basic pylons of web development are HTML, CSS, and Javascript. The links presented below are not, by any means, some secret data that I dug out from the depths of the internet. You probably know about them, I'm just here to say that it's ok to use them, they are just fine, you don't need to buy an overpriced online course to learn the basics and even more.

The 3 basic pylons of web development are HTML, CSS and Javascript.

1. HTML

"Nothing special" they would say, “Easy peasy" some would speak, yet a lot of students are lacking the basics of the HTML. id vs class, inline vs block, and much, much more of course.
So in order to get used to this mysterious creature you should check out these links:

• https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML
• https://developer.mozilla.org/en-US/docs/Web/HTML/Element
• https://www.w3schools.com/html/default.asp
• https://www.tutorialspoint.com/html/index.htm
• http://learn.shayhowe.com/html-css/

 Nothing special! Easy peasy! 
 Is that what you think about HTML?

2. CSS

“Children's play!" would say the backend guy, “Noob stuff!" you could hear from a Java guru. Don't let these affirmations fool you. CSS is a majestic beast, and if you won’t learn to appreciate it and understand it, it will find you and it will kill you, like that cool guy from Taken.
In order to play around with CSS it could be useful to use a reset file, but first, check out these links:

• https://developer.mozilla.org/en-US/docs/Learn/CSS
• https://www.w3schools.com/css/default.asp
• http://learn.shayhowe.com/html-css/
• https://necolas.github.io/normalize.css/ (a reset file example)

Children's play!
You think CSS is that easy?

3. JAVASCRIPT

This thing was created in 1997 in a week and the boss guy said to the developer guy that it should have at least some similarities with Java (the cool kid around the block at the time) so don't expect much from it. Kidding, it’s a quite nice, powerful, and relatively easy to grasp programming language. But like any other language, it has the possibility to do something in so many different ways and that for sure will play with your mind for a long time. In order to learn the basics check out these links: 

• https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics
• https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/A_first_splash
• https://www.w3schools.com/js/default.asp
• jQuery bonus

As any other language, Javascript has the possibility to do the things in so many different ways! That may be good, who knows.

Tools

You don’t really need any fancy tools to test your skills. A simple text editor and a browser will be enough to see the result of your coding. I recommend using Google Chrome because it has an amazing developer tool kit. If you want to share your work with your friends or you want to get some feedback from someone, you should definitely create a GitHub account. That will allow you to post your code as an open-source project.

• https://www.sublimetext.com/
• https://code.visualstudio.com/
• https://atom.io/
• https://codepen.io/
• https://www.google.com/chrome/browser/desktop/index.html
• https://developer.chrome.com/devtools
• https://github.com/
• https://guides.github.com/activities/hello-world/

 You don’t need any fancy tools in order to test your web development skills!

NOTE: 
This article is intended for students who have small or no experience in web programming, so I posted here only the links with some basic information, those being crucial for them to understand first.

The author (Jonathan Z. White) of this article did an amazing job of describing what you need to know to become a "Hero" Front-End Developer. Great stuff!

Conclusion

There is an immense pool of information about front-end development out there, too much and too heavy. If you want to learn the basics, then learn the basics, learn the theory, learn the theory, again and again, I know it sounds “stupid” for someone. Why should I learn the theory, should I do something practical? But believe me, without theory you will be able to do some nice stuff, but you won’t understand how they really work. It sounds ok, but it’s really not, doing something that you cannot really explain is like a curse. So my friends, don't be afraid to upgrade your theory level alongside your practical skills.