Here is the right approach to start studying programming, with JavaScript as the first language. How to focus the learning of JavaScript and the become a frontend programmer in general?
In this article, we aim to guide people who start studying Javascript and those who begin studying programming and want to approach this world using a simple language to learn and use in the professional environment.
Starting is simple, but there is a long way to go if you are to get to squeeze all the possibilities of language. Javascript is one of the standard languages of the web and therefore ideal for many of the professionals who think about dedicating themselves to this medium. However, even if you do not want to develop individually for the web, Javascript is an excellent alternative to make mobile applications or desktop applications.
Perhaps not all developers need to reach an advanced level of Javascript, but no doubt a basic knowledge will be of great help in many moments of their professional career. In any case, having completed the apprenticeship, you will have at your disposal an endless number of opportunities.
We will start by analysing the state of Javascript currently (2018) and the reasons why it is worth using Javascript in general. Then we will explain how you can learn Javascript and reach any level that we propose.
Javascript is everywhere
Javascript has become an ideal language to learn, because it has many and varied applications, as well as providing simplicity for people who start. To run it, we only need a browser, although Javascript has now surpassed the scope of web clients, can be located almost anywhere.
Javascript on the web
The environment where Javascript first appeared was the web. Its execution focused on the scope of a web page and allowed developers to provide interactivity, manipulate the document or the browser window, perform calculations, etc. Netscape Navigator, a browser that has disappeared today, has the honour of having introduced Javascript as a language, although today it is supported by all web clients with which a user can navigate.
Using Javascript for the web, in the browser environment, is also known as client-side programming. Today is still the most common environment for JavaScript execution, but it is just one more among its possibilities.
Need Programming Assistance? You can hire a programmer to do your JavaScript or Java Assignments. Use Do my Java Homework service to hire Java programmer now.
Javascript on the backend
Some developers came up with the idea that they could extract the Javascript execution engine, which until then was only available within the scope of the browser, to use it for any other purpose outside the web client. This is how NodeJS was born, which is nothing more than Javascript outside the browser.
With NodeJS we can program with Javascript applications that run directly on the operating system and that are capable of solving any problem. With this technology, Javascript became a general-purpose programming language.
One of the most common uses of NodeJS is backend programming. It allows you to program applications that are capable of running on the server, providing access to databases, the file system and any other server-side resource. However, NodeJS is so broad that it can be used for many different tasks, such as automation, optimisation or application deployment, among other operations.
Javascript as a language for device apps
For years it has also been possible to use Javascript as a language for the creation of applications for devices (mobile apps, tablets, TVs ). The developed applications are installed from the corresponding app stores of the primary mobile systems, and the user does not perceive any difference in these concerning the applications developed with the native languages. But, by the fact of being programmed with Javascript and HTML5, they open a new field of action for people experienced in the development for the web and dispenses from the learning of native languages for each mobile platform.
In the beginning, to execute applications made in Javascript and HTML5 a “Web View” was needed. The function of web view is to provide a framework for the implementation of the app so that it is executed within a browser, although the user does not perceive it. This situation has several advantages and disadvantages that we are not going to enter, but today there is also the possibility of using Javascript as a language for developing native applications, which do not require a web view to work.
Examples of frameworks for the development of applications based on web view we have Apache Cordova, Phone Gap or Ionic. Examples of frameworks for the development of native applications using Javascript have Native Script and React Native. All alternatives have the critical advantage of producing apps for Android and iOS with the same code base, as well as for other minority systems.
Javascript as a language for desktop applications
Another area in which Javascript has penetrated with force is the development of applications for personal computers. With Javascript, we can create advanced applications, capable of using all the resources of a computer and also running on any operating system that we need.
Using Javascript for desktop applications is easy thanks to projects such as Electron, which allows us to produce cross-platform applications, that is, they can be installed on Windows, Mac OS X and Linux. There are many known applications developed with Electron, such as Atom, Visual Studio Code, Slack, Hyper, etc.
Javascript on the web
The scope of Javascript is extensive, providing alternatives for almost any execution environment. However, if we want to start learning Javascript, the most appropriate place is the web.
Within the development discipline of the client side (Javascript executed within the browser environment), we can find different types of projects, which also require different approaches and knowledge.
Websites
When we refer here to websites we want to indicate sites where the most important part is the content, be it blogs, news pages, and even electronic commerce.
Javascript in these cases is dedicated to providing functionality and interaction, allowing dynamic user interfaces, response to user actions, validation of forms, etc.
Single Page Applications
In recent years, the web has become famous as a platform for business applications. Applications called “management”, which were previously executed with desktop programs, today have web fronts that allow us to use them from the cloud, i.e. from any browser connected to the Internet and without the need to install software on the machine. In this type of application, it is usual to carry much of the processing load from the server side to the client’s scope. In this new paradigm, the browser is responsible for doing many more things than traditional websites, such as the creation of HTML code to visualise data or navigation between screens or routes of the application.
In the Single Page Applications, also known by its acronym SPA, it is normal for the server to deliver only raw business data and that the browser does all the work of presenting that data in an appropriate format (HTML is produced in the browser). To represent that data). But what most characterises an SPA is that navigation is always done within the same page, and Javascript is responsible for presenting one or another screen to the user without having to reload the entire set of the page.
The two main factors that characterise the SPA, 1) the fact of bringing the raw data from the server (lighter) and 2) all the navigation is done within the same document, they produce web applications with a speedy response, providing an experience of use close to that of a desktop application.
Other article & tutorials related to Java- My first Java program, Java for Zombies
Libraries, frameworks and “Vanilla Javascript” development for the web
The creation of an SPA is a much more advanced task than the development of a website and to be able to perform this work it is essential that the development team is based on a Javascript framework, such as Angular, React, VueJS, Ember or Polymer.
Note: React, and Polymer are considered more libraries, but with a series of additions, which they provide in many cases, offer as many features as those found in a framework. In case someone does not know yet, a library is a set of functions, or classes and objects, that allows us to perform a range of everyday tasks for the development of specific applications needs. A framework is distinguished mainly from a library because, in addition to providing code to solve common problems, it offers an architecture that developers must follow to produce applications and ensure better code quality and greater ease of maintenance. In other words, the framework, in addition to offering different utilities, sets a style and workflow when it comes to developing applications.
For the development of websites, it would generally be enough with the use of pure Javascript, without having to rely on any additional library. That “pure” Javascript development is generally known as “Javascript Vanilla”.
Note: It should be clear that “Vanilla” is not a trademark or any Javascript flavour beyond the language itself. It’s like a joke to indicate that with Javascript (and nothing else) you can solve all the things offered by libraries and frameworks already made.
However, it is also common that libraries such as jQuery are used in the development of websites. jQuery is a set of objects and functions (general utility code) that aims to help you manipulate the page, saving the differences between different browsers and allowing you to write a single program that runs correctly in any web client. Besides, jQuery offers many functions that are useful for the development of many common tasks of websites, which you can use in a faster way than if you work only with Javascript.
Note: Concerning jQuery, it is convenient to mention that there is a stream of developers who warn that using jQuery is not necessary in most cases. Using jQuery is not bad, but many people implement it to solve needs that a bit of Javascript “Vanilla” can do. Sometimes jQuery is loaded by default, perhaps for convenience, for letting go or just for lack of knowledge of the Javascript language itself, and yet very few of its functions are used. There are more specialised libraries to solve each one of the things that a generalist bookstore like jQuery offers and that they occupy much less weight for downloading and processing time for browsers.
But beyond libraries and frameworks we must know that today, in addition to the language itself, there are many other Javascript-based technologies in browsers to solve a wide range of needs.
HTML5 APIs
With the arrival of HTML5, there was a greater standardisation of browsers, reaching a commitment by manufacturers to support the web languages (HTML + CSS + Javascript) as dictated by their specifications. But besides, it produced an abundant current of new specifications to work with the most varied range of resources of the navigator, computer or device.
HTML5 offers APIs for working with elements such as camera, geolocation, storage, bitmap or vector drawing, audio, video, etc. Everything that HTML5 offers is available in all browsers and is part of the Javascript developer toolkit, without the need to use any library or framework.
Web Components
The next development revolution for the Internet, which still has not finished exploding in the middle of 2017, is called Web Components. It is based on a new API (with several specifications together) aimed at creating components. The components are like new HTML tags that any developer can create to solve common or particular applications problems.
With web components developers can extend HTML by creating new components capable of doing anything and with advanced encapsulation capabilities, to respect their autonomy and to be able to be used in any project, maximising code reuse capabilities and without the need to be based on any library or framework.
Like HTML5, Web Components are offered by browsers by default, although their support at this very moment is not so universal.
Note: In the coming months, all browsers are expected to support Web Components V1, and we can use it without any restrictions. Meanwhile, there is a Polyfill that allows extending Web Components support to browsers that do not yet have it. Polyfills are literally “gap fillers”, which make up for the shortcomings of older browsers to standards. HTML5 APIs are already being used intensively to allow new features of web languages to be used in old or outdated clients.
Javascript as the first language
If you are learning to programme, Javascript is an excellent bet to start. Mainly for three main reasons:
Ease of use
We do not need more than a browser to be able to execute Javascript. It does not require any compilation (process to create a binary executable file for a particular operating system) but is interpreted. This implies a more simplified workflow, which facilitates the first steps. Also, Javascript is dynamic typing, and its syntax is less elaborate than other languages and allows you to do things in different ways, according to the skill, preferences or habits of each programmer.
Wide areas of application
As we have seen, Javascript has practically unlimited uses. It means that you can use the language almost for what you need. By learning a single language, you will be able to achieve whatever purpose you set for yourself.
It is an open and standard web language
At some point in your professional activity, most developers will work in the web environment. Learning programming with Javascript assures us that the knowledge will be applied directly in several moments of the students’ professional career.
These are the reasons why we have been teaching to program with Javascript for more than ten years and for which in 2017 prestigious universities of Stanford have abandoned their course of introduction to Java programming in favour of Javascript.
Multiple professions start with Javascript
Another reason why it is worth beginning with Javascript is that language is one of the fundamental pillars to play numerous jobs demanded within the scope of the web.
Frontend developer
It is the professional that deals with the development of the client side, although it may have various activities besides programming, such as design, layout, user interface development, SPA applications on the client side, etc. Javascript knowledge is fundamental in all areas of performance of a frontend developer.
Backend developer
As a backend, we understand server-side programming. For the backend, the truth is that Javascript (with NodeJS) is just one of the many possibilities. However, NodeJS offers many advantages such as its asynchrony, speed and optimisation, which makes it ideal for many types of projects.
Full-stack developer
A full-stack developer is one that is capable of working both on the client side and on the server side. In reality, it is a rare breed, so much so that it is said many times that it does not exist, because it requires a lot of knowledge of the developer and therefore it is very complicated, or impossible, for a single profile to gather them all. However, in my opinion, it is a reality in many jobs since there are professionals who must have a global knowledge in several areas (freelancers are the leading example) and therefore it is a figure that does exist. Today, the fact of Javascript serving both the client and server side makes the full-stack developer much more comfortable and facilitates the lives of thousands of developers, since it avoids the mental fatigue of moving from a language to another constantly.
Note: Specialisation is also present in these professions. It is incredible to see how profiles develop in the world of the web and how newly specialised professions are generated year after year. What we used to call frontend, to be sure, today we can subdivide it into dozens of profiles or specific jobs such as “front-end engineer”, “frontend web designer”, “CSS architect”, “mobile frontend developer”, “frontend DevOps”.
How to learn Javascript
Learning Javascript at an advanced level requires months of study, but starting is very simple, and in a short time you will be able to do amazing things with little effort. In the Javascript manual you will know the language, but to start, we want to give you a couple of tips.
Learn Javascript and not a derivative
Our first advice if you are starting is that you learn Javascript and not a library or framework. In the end, all the projects on the web use Javascript and everything you can do with a library or framework you can also do it with Javascript, so the correct thing to do is to start dominating the language, and then set new goals in the medium or long term.
In summary, do not learn jQuery: learn Javascript. Do not learn Angular: learn Javascript, do not learn React: learn Javascript With a solid base of Javascript it will be much easier for you to learn any library or framework you want to base later on. Also, you will not have problems in the future, when you want to do things for which that library is not designed or want to customise any detail of your application.
What should accompany the knowledge and use of Javascript are your skills in everything that the browser (the web platform) offers by default: HTML5 and Web Components. Everything you based on Javascript “Vanilla”, HTML5 and Web Components you have the certainty that it can be used in any project where you can get to work, regardless of the library or framework that is being used in each case.
Knowledge of the web platform
Our second advice is that, if you are going to work in this medium, you must keep in mind each one of the particularities of the web platform. There is a lot of general knowledge that you must acquire and that will give you a base on which to base your skills in the world of development for the web.
Knowledge of the medium: You must know what is the Internet, the Web, the HTTP protocol, the system of domain names and of course the primary languages to specify the content and form: HTML and CSS.
Design knowledge: Although your profile may be more of a programmer, it is ideal to have a vision, at least technical, of the design characteristics for the web. User experience, usability, graphic design in general or accessibility are essential points.
Programming knowledge: If you are going to dedicate yourself to the programmer’s profession, it is not enough to have a basic understanding of code and structured programming, it is ideal to be interested in object-oriented programming, software analysis and design, design patterns, bases of data, etc.
Knowledge of tools: The professional must also know a large group of tools for day-to-day work, from the command line terminal and basic server administration to the automation of tasks, through the version control tools ( Git preferably) and optimisation.
Fortunately you can know or learn all these languages, technologies and tools for free with on the web, but if you want a guided learning or want a personal programming tutor for one to one coaching or to solve your Java assignments or other programming projects, we recommend you to write to us with your requirements.
