Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 07: ES Module System in JavaScript

In this video, we discuss the ECMAScript module system in JavaScript in preparation for a discussion as to how that same module system is used within the React.js framework for creating and isolating individual components.


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/

Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 06: Introduction to Functional Components

React.js is a JavaScript framework that specializes in the creation of user interfaces and the definition of user experiences. React.js focuses on the separation of concerns through the creation of components. Those components are then used together to build out the functionality of the entire user interface, this is called composition.

In this video, we will explore what is called functional components in React.js. We will discuss what they are, how they are used, and when to use them.


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/

Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 05: ES6 vs ES5 and Transpiling Source Code

As programming languages evolve more features and abilities are added to it. Sometimes these changes may not be supported by existing execution environments, these are known as breaking changes. In the case of JavaScript, it has continually changed over the last 20+ years. With each new version, we have to wait for user’s browsers to slowly implement those new features. This can sometimes take years and yet developers would like to use those new features the second they are available.

Frameworks like React.js rely on these new language features many of which are not yet supported in modern browsers. Being that React.js SPAs run in browsers, we run into some serious issues if we try to run modern JavaScript in those browsers. To handle this, developers came up with a nifty solution called transpiling source. When we transpile source code we convert source code from one language to another or from one version of a language to another version of the same language.

When we create a React.js SPA using the CreateReactApp NPX utility, it sets up the application to be transpiled from ECMAScript 6 or ES6 (the latest version of JavaScript not entirely supported in modern browsers, but progress is being made) to ECMAScript 5 or ES5 before it is run in the browser. This allows React.js developers to use modern JavaScript features while having their code transpiled to a backward-compatible version that will run in all browsers.


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/

Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 04: React App Structure

In this video, we walk through the structure of a React.js SAP.


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/

Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 03: Visual Studio Code

There are a lot of Integrated Development Environments or IDE’s out there. These are editors for code, you could compare them to what Microsoft Word is to a word document. IDE’s provide not only the ability to edit code but also:

  • View an entire project and its associated files
  • Manage files within a project
  • Manage the execution environment in which your code runs locally to test it
  • Debugging code
  • Integration with source code management utilities like Git
  • .. and a lot more

All of these abilities make IDE’s preferable over simple text editors. In this video, we will introduce you to Microsoft’s Visual Studio Code, which is a free IDE Microsoft has provided developers. It is a great way to become familiar with IDE’s and to get started developing software.

Links

https://code.visualstudio.com/


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/

Tech Tutorial: Learning React.js for Single-Page Web Applications – Episode 02: NPX and CreateReactApp

React.js JavaScript applications are primarily single pages applications or SPAs. SPAs run primarily in the user’s browser and interact with a back-end RESTful API. Due to this, React.js application can become quite complex to setup. To mitigate the complexity inherent in setting up a SPA application, the CreateReactApp node.js package was built. This package is an executable NPM package that can be executed using NPX.

In this video, we walk through setting up a new React.js SPA using the CreateReactApp utility.


Personal Recommendation (unpaid)
Programming and software development are awesome! Being that you are learning along with me, there is a really good chance you can make this a career. Based on my own life experience, let me suggest to you that you go get a Computer Science degree from Neumont College of Computer Science and kick your life into hyper-drive.

visit: https://www.neumont.edu/