9 projects as assignments will force you to learn through yourself, whose knowledge will eventually retain in your body.
Why this course?
There are many web front-end courses out there. This course has the following features:
Why there is no detail steps in those projects?
Usually a project is guided as a walk-through in other online courses. The good side is that you can follow the steps to build whatever it instructs you. However, simply typing by following instructions doesn't give much to you. You have to first understand and then do it on your own to retain those knowledge in your body. Project without detail steps trains you on how to attack the problem (the project to be built in this case) using the knowledge learned. Hence, you need to do your research and find ways to solve each issue blocking you from going further.
There are two ways of thinking, reactive thinking and proactive thinking. Reactive is you start to remember something after logically reminded by other things. Proactive is thinking without direct reminding or hints. The latter is much more difficult than the former. Doing projects by reverse engineering trains you in the latter form.
What if I get stuck or don't understand it?
Well, that's the point of learning, right? Try to search online and use resources to solve your problems. You need to think and train yourself to learn how to attack any obstacles that in front of you.
But there are other courses that have longer duration and wider coverage on those topics?
You can learn comprehensively or learn what is enough to get you started. I personally enjoy knowing just what I need so that I can get my hands dirty on doing stuff. Look at those topics that are covered in this book, each one could be a complete book or course to study. It all depends on what you are interested in.
So what should I plan to do?
1. Watch the tutorial video and know the element topics in the tutorial.
2. Practice writing code of each element topic yourself and see the outcome of it. Any trouble, google it.
This lecture talks about what HTML is, text editor you can use and start to look at some basic HTML tags such as <head>, <body>, <h1>, <p>, <br>
Here we talk about some HTML attributes: id, name, value and etc. Also, we will start to use HTML styling, such as background-color, fonts and etc.
We continue to talk about HTML tags. This time we will look at <div>, <span>, <a> and <img>
More tags are coming here. We will be looking at how to build table and list in HTML.
This is our first project. We'll build a simple website using the HTML knowledge we have learned so far. I know you can do it.
This is our first CSS tutorial video. We'll have a brief intro and start to look at some of the CSS powerful selectors.
We will look at different ways of inserting CSS elements into HTML. Besides that, we will look at some background properties.
In this tutorial, we will look at text, font and link property.
So here comes the box model, border, margin, padding and dimensions.
We will talk about display, position, z-index and float property.
BootStrap is probably the most popular front-end framework currently. This tutorial will have a brief intro on it.
Here we look at some of the BootStrap template and see how we can leverage it for our use.
We'll look at some BootStrap components and see how to actually use them. A login example is presented.
Here we look at how to use BootStrap table and navigation bar.
In the example, I'm showing an online music store. Yet, it doesn't have to exactly the same. Use your imagination and knowledge learned to try.
This tutorial talks about the first part of data types.
This tutorial will look at array and some of its methods.
In this video, we will be looking at some interesting JQuery effects, which you can use to make your website vivid.
Here we look at how to manipulate HTML elements using JQuery.
In this course, we will be talking about AJAX, which in general is for browser to exchange data with server without reloading the whole page.
We'll be developing a stylish camper news page. We'll be using some api to get the news feed data. You can refer to the project guide for more information.
In this project, we will develop a simple Wikipedia search engine. Again, we will be using some of the api from Wikipedia. Hope you will enjoy it.
Le Deng was first exposed to programming when he was at elementary school and his first language was Logo, a 2D drawing programming language. He received his BS in Electrical Engineering in China and his MS in Electrical Engineering at RIT in US. He has been both a learner and a teacher through the course. In the past few years, he has been interested in web technologies and working on his own path to become an entrepreneur. He’s life philosophy is to contribute a hand on better shaping this world and he is willing to spend just a life-time to fulfill it. He is currently working as a consultant in Boston US.