How to build web apps with HTML5, CSS3 and JavaScript

HTML5, CSS3, and JavaScript are now such powerful tools that you can create fully-fledged web apps as capable as desktop apps

WHAT IS A WEB APP?

The idea that skills acquired as a web designer can be applied to app design isn’t a big step, but a common concern amongst designers and developers interested in making the jump is how to translate their experience in one medium to another. In reality, a web app is nothing more than a specialized website running in isolation. What makes a web app different to a regular website can be boiled down to the way data is stored, retrieved and processed. A typical website will use the client-side HTML layer to present information to the user. When an action is performed, whether it’s adding an item to a shopping cart, or marking a to-do item as complete, the website will send a message back to the server, where the action is performed.

In a web app, typically actions are performed on the client, and often the data is stored on the client too.

Source: SohoWebDevelopment

What full stack means?

front end + back end

Before you jump into the learning the skills, let’s get clear on what a full stack developer actually is. Full stack developers are developers who work with both the front and back end of a website or application. They’re familiar with HTML, CSS, JavaScript, and one or more back end languages. Hence the term “full stack”—they’ve got all the web development skills to build sites and apps from start to finish.

ESSENTIAL FRONT END DEVELOPER SKILLS

JavaScript libraries and frameworks (jQuery, React JS)
Version control/Git
Responsive/Mobile design

PROGRAMMING LANGUAGES FRONT END DEVELOPERS NEED TO KNOW

HTML
CSS
JavaScript

ESSENTIAL BACK END DEVELOPER SKILLS

API architectures (REST/SOAP)
Database management
General understanding of front end technologies (for cross-team communication)

PROGRAMMING LANGUAGES BACK END DEVELOPERS NEED TO KNOW

Python
PHP
Ruby on Rails

Source: Skillcrush

If you’re already well-versed in front end web development and are determined to go full stack, these are the back end developer skills you’ll want to start learning next.

Front End Development

Have you ever looked at your favorite website and wondered why it was laid out the way it is, the way the buttons acted when you clicked them, or any other part of the site and thought, “I wonder how complicated that is?” or, “I wish I could do that”? Well, all of those visible site features are built through front end development (sometimes also called “front end web development”)—and the people behind them have a name: front end developers. Front end developers are some of the most in-demand roles, and for good reason—we wouldn’t get to enjoy internet black holes without them. In a second, we’ll break down all the skills front end developers use and need, but here is a quick front end development definition:

What is Front End Development?

While web design is the way a website looks, front end development is how that design actually gets implemented on the web.

web designer works on the appearance, layout, and, in some cases, content of a website. Appearance, for instance, relates to the colors, font, and images used. Layout refers to how information is structured and categorized. A good web design is easy to use, aesthetically pleasing, and suits the user group and brand of the website. Many webpages are designed with a focus on simplicity, so that no extraneous information and functionality that might distract or confuse users appears. As the keystone of a web designer’s output is a site that wins and fosters the trust of the target audience, removing as many potential points of user frustration as possible is a critical consideration.

A front end web developer is the person who implements web designs through coding languages like HTML, CSS, and JavaScript. Though it’s not as common anymore, front end developers are/were sometimes called “client-side developers” to distinguish them from back end developers who program what goes on behind the scenes like databases. If you head to any site, you can see the work of a front end developer everywhere—in the navigation, layouts including this article page, even the way that a site looks different from your phone (thanks to mobile-first or responsive design). Want more? You can read our guide on everything it takes to start a web developer career here.