Learning about the difference between font end and back end code and more advanced front end code.
This is where things start to get more difficult, but you don't need to be a professional web developer yet. You'll need to be rather familiar with HTML, CSS, and JaveScript.
From this point on, everything will be discussed in terms of of two categories: front end and back end. Here's what these terms mean:
Any time you hear about something new, like Express.js, you should ask yourself "is this front end or back end stuff?" If something falls into the back end category then you need a server that will support it. Express.js is a back end framework that runs on node.js (which is effectively a web server). Some things are frameworks with both front and back end parts to them, but it is more common to find frameworks for one or the other.
Not all hosting services support back end development. KISSr, for example, doesn't support any back end development at all. All it will do is send your files to the browser and any code will have to run in the browser. Other web hosting services may only support PHP and the MySQL database, but not node.js. Yet others might support almost anything if you know what you're doing.
Before moving on, check out FreeCodeCamp. You could almost just go to this site and forget about the rest of this page. They have almost everything you need to know including:
But in case that seems like too much to bite off at the moment, I've provided some other suggestions below.
Bootstrap is a HTML, CSS, and JavaScript front-end UI framework that improves layout across devices with different screen sizes (responsive design) and provides a large number of HTML/CSS components for you to use. This may sound complicated, but it makes it easy to create some very professional looking web pages. In fact, this page was created using Bootstrap 4.
One of the biggest advantages of using Bootstrap is responsive design which means that anything created with it almost automatically looks good on everything from a mobile phone screen to a desktop web browser.
Bootstrap tutorials are available at w3schools.com, tutorialspoint, and TutorialRepublic.
You may be able to create dynamic web pages with DOM methods or jQuery, but there's a better way! These days there are a nuber of frameworks for reactive HTML that will automatically update your page for you whenever you change a property in JavaScript. The top three frameworks that do this for you, among other things, are Angular, React, and Vue.
But I recommend learning Vue because it is simple, works well, and is easy to learn. There are also good learning materials for it online.
Here's an excellent video about how it works:
If you're already hooked on the whole idea after watching that, then Watch the Intro Course Videos and after you've done that move on to the Official Vue Guide.
If you haven't already, learn SQL with the Intro to SQL: Querying and managing data lessons on Khan Academy or something similar.
After learning SQL, you might want to install some free SQL relational database software on your own computer. The two most popular free and open source SQL relational databases are MySQL and PostgreSQL. Both of these come with installers and excellent GUI management tools.
SQLFiddle can be used for sharing code you're having trouble with or testing things out without having to install database software.
Here are some sites where you can play around with JavaScript, Bootstrap, other front-end frameworks, and in some cases even experiment with server-side scripting using Node.js and Express.js: