Start to learn frontend web development.

Book and MOOC of March

Bought the most recommanded books on Amazon. It is well structured and with really good design. I believe these two books are more for designers than developers. It grasps me immediately. I took a few weeks going through and picked up the fundementals which I could hardly study in detail when doing projects.

I also roughly went through the class video of two Udacity courses on HTML, CSS and JS. I am a person who gains more effeciveness from books than videos. Taking the courses is more for idea introduction.

(Set a personal target, went through a book and a MOOC every Month)

Tool & Resources

Editor

Sublime remains as a quite popular editor for web developer. I started with it as well. But later I come across Brackets, the open source lightweight text editor by Adobe, and fall in love with it immediately. Sublime are considered powerful but requires quite amount of effort to get familiar. In addition, it is literally not free. Brackets instead has a less steeper learning curve. It also supports a lot of plugins. After I installed it, I have easily setup plugins for vim, markdown viewer, solarize theme which I normally get comfortable to work with.

Another popular editor is Atom from Github.

CSS Preprocessor

Less and Sass are two popular CSS preprocessor. CSS preprocessor allows you to write css code in a more “programming” way since it helps to structure code in module and make it resuable. Tried with both and really enjoy the convinience that has been brought by the preprocessor.

Framework

There are various css framework that ease the develop effort. But I have not really got to using that intensively since the current practices are limit to simple displaying page.

In Practice

To get more familiar with the tools, I start to study the code from others. A beautiful UI sample from paul van oijen. I am impressed that css can do so much. Then I borrowed the code and redesign my blog style by introducing the navigation style in. I also came across the site CodePen, that allows online editing html, css and js. A lot of nice work are submitted here.

My little blog becomes my first frontend project. I start with Jekyll, a simple web framework. Sass is used as the CSS preprocessor. The design of the layout is in Sketch and Brackets as the editor. All the tools are new to me, but I become comfortable with them very soon. The weekend project is most enjoyable.

Having been introduced to the wonderful world of web development for a few months. It is really an eye opener. Taste a little bit of the frontend as well as the backend, but only a tip of the iceberg. Will continue to learn more and improve.

Buy Me A Coffee