There’s a lot of information in regards to learning about our Vancouver web design and web development. There’s so many things you need to know so it will be very hard to find the right advice and tips from all the different sources. That’s why this roadmap has been created for beginners like you! It lays out all the basics you need to learn web development. We’re going to go through each step so by the end of this guide you’ll have an understanding of the basics of web development and what skills you need to learn. Make sure to check out our Blog for more of these lessons and courses.
If you haven’t read the previous part of the lesson, you can read it here: Learning Vancouver Web Design and Development and the part 2: Back-end web design.
Make sure to check out our YouTube Channel for free video guides and courses!
Lesson 1: Web Development pt3 | Vancouver Web Designer Explains
Javascript and Nodes
Javascript is a programming language that was designed to run in the browser. Using JavaScript, you can make your website respond to different inputs from the user or other sources. For example, you can build a “back to top button” that when the user clicks it, they’ll scroll back up to the top of the page. As we mentioned, HTML ,CSS, and JavaScript are the basic building blocks of front-end web development. In addition to them there are a few other tools that you’ll want to learn at this point. Package managers are online collections of software. Most of them are open source. Each piece of software called a package is available for you to install and use in your own projects. You can think about them like plugins. Instead of writing everything from scratch, you can use helpful utilities that other people have written already. For instance, you can simply use a slider plug-in instead of having to code it all yourself which could take days to figure out. Why reinvent the wheel if they already exist? If you want both of these things to be done by professional web designers, click the bolded text.
The most popular package manager is called NPM or node package manager. You can also use another manager called yarn. Both are good options to know and use. Although it’s probably best to start out with NPM, in addition to being a package manager, you’ll want to become familiar with build tools. Module bundlers and build tools are another essential part of the front-end workflow on a basic level. These tools run tasks and process files.
Essential Tools for Web Design
If you were to try to do all these essential steps by yourself, three tools that you’ll continue to come across a lot are gulp web pack and parcel. Personally, I like using gulp for my own front-end workflows where I just want to compile my sass and JavaScript files and not do too much else. The last tool you’ll need to learn about in this stage is version control. Version control, also called source control, is a system that keeps track of every code change that you make in your project files. You can even revert to a previous chain if you make a mistake. It’s almost like having infinite save points for your projects and let me tell you it can be a huge lifesaver. The most popular version control system is an open source system called git. Using git, you can store all your files and then change history in collections called repositories. You may also have heard of github which is an online hosting company owned by Microsoft where you can store all your git repositories.