Progressive Web Apps Development

v0.5.15 2019-06-13T17:18:54
Be Very Aware!
This Web Site Is Under Construction

Work in Progress


About : This site is about my deep dive into Progressive Web Apps technology to understand it and figure out a PWA Development Architecture for creating this site. It is not about the nuts and bolts of how to create Progressive Web Apps, but about the PWA Development Architecture used to create this site

API: Application Programming Interface : A set of definitions, communication protocols, and tools for building Progressive Web Apps. It is a set of clearly defined methods of communication among various components. APIs makes it easier to develop Progressive Web Apps by providing building blocks, which are then put together by the developer.

CSS: Cascade Style Sheets : A web standard programming language. It is a stylesheet that describes the presentation of a document written in HTML. It describes how HTML elements are rendered

Component : Components are the smallest, yet most fundamental part of React. They’re similar, in concepts, to things like widgets and modules

DOM: Document Object Model : The DOM: Document Object Model is an object-oriented representation of the web page that can be modified with JavaScript. The browser rendering engine takes the web pages HTML and CSS files and turns them into pixels on the screen

DOM: Virtual : React uses a virtual DOM to find differences between what’s already in the browser DOM and on the screen, and the new view. This speeds up the process of changing pixels on the screen

Gatsby : A blazing fast Progressive Web Apps generator for React

Git : A source-code management system for tracking changes in computer files and coordinating work on those files among multiple people

GitHub : A web-based hosting service for version control using GIt

GraphQL : A data query language

HTML: Hyper Test Markup Language : A web standard programming language. It describe and define the content of a webpage.

IndexDB : A web browser standard interface for a transactional local browser database

JAMstack : A modern web PWA Development Architecture based on client-side JavaScript, reusable APIs, and Markdown

JavaScript : A web standard programming language. It is the de-facto browsers language to control the behavior of web pages

JSX : JSX is an extension to the JavaScript language syntax. Similar in appearance to HTML, JSX provides a way to structure component rendering in React using syntax familiar to many developers

Markdown : Markdown is a lightweight markup language with plain text formatting syntax. Markdown is regular text with a few non-alphabetic characters added. It is designed so that it can be converted to HTML

Native App : An app downloaded from an app store built to run on a specific platform

Netlify : An Application Delivery Network service providing continuous web deployment

Node : An open-source, cross-platform, asynchronous event driven, JavaScript runtime environment

Npm : The package manager for JavaScript modules and the world’s largest software registry

PWA: Progressive Web App : Web apps developed using a number of specific technologies and standard patterns to allow them to take advantage of both web and native app features

React : A declarative, efficient, and flexible JavaScript library for building user interfaces

Repo: Repository : A Git file structure for tracking file changes and coordinating work on those files among multiple people

Service Workers : A virtual proxy between the browser and the network

VScode : An alias for the Microsoft Visual Studio code editor. It is Central Command for building PWAs

UI : User Interfaces, sometimes called a view

Web Standard Programming Languages : HTML defines the content of web pages, CSS specifies the layout of web pages, JavaScript programs the behavior of web pages

John Telford
John Telford
Portland, Oregon