Development Stack¶
Note
Work in Progress
Home page Web Technology Consulting
Components¶
The development stack is used to create, deploy, and manage web sites ,
VScode¶
Developers using Visual Studio Code 1 as Central Command and Control enables developing, managing, controlling, and deploying web sites. VScode, is a lightweight open source code editor that runs on local development computers, and is available for Linux, macOS, and Windows. It may be the best text editor in years
Git 2 source control is built-in to VScode. There are a wealth of easily install extension customizing VScode look and feel. Several color themes, programming language specific intelligence code completion, snippets, color coding, error checking, spelling, and many more are available.
Git¶
Git 2 is a key development stack component. It is a distributed version control system designed to track project file changes. Some of its attributes are speed, data integrity, and support for distributed, non-linear workflows and keeping track of file changes among multiple developers. Git is responsible for everything GitHub-related that happens on local development computer
GitHub¶
GitHub 3 is an online web hosted repository for git 2 projects. It is a platform for hosting versions of most type of project files in a remote repository that is a unified source of truth. It helps software teams collaborate and maintain the entire history of projects file changes. Developers can view history of changes and go back to a previous version. It helps answer the questions who changed what, where, when, and why?
A local copy of the project GitHub 3 repo is stored on the local development computer. Git is responsible for everything GitHub-related on the local development computer. Git 2 is used to stage edited local repo files, create the required why message, communicate with GigHub and commit staged file from the local development computer repo to the remote GitHub repo.
Git - GitHub Difference¶
Netlify¶
Netlify 4 is a popular Application Delivery Network (ADN). It provides continuous web deployment. When Netlify is notified of a commit to a shared GitHub repository that has been configured, or by the Netlify CLI Command 5 program running on the local development computer, Netlify builds the web sites from the shared repository and deploys the web worldwide to every major cloud provider. Netlify can deploy previews of web sites before pushing them to live site.
Using the Stack¶
Editing¶
Sphinx 6 is the framework for building this site. It requires using Markdown or reStructuredText for text material editing. My preference is reStructuredText.
Most development time is spent editing web site text material. The VScode reStructuredText Extension 7 dramatically speeds up development supports reStructuredText features:
Syntax highlighting quickly detects reStructuredText errors while typing or compiling, and may give hints about the problems
Frequent snippets of code can be quickly inserted
Section builder provides a quick way for setting section header levels
Live preview compiles source files in the background. Quickly invoking live preview while editing, shows how the edit will be displayed on the web
Deploy¶
Frequently viewing the state of the entire web site on the web helps
Deploying web site draft preview:
# Compile reStructuredText to HTML
make html
# Deploy web site draft preview
netlify deploy
# View draft web site
# Click on the Website Draft URL
Deploying a web site production version is similar:
# Compile reStructuredText to HTML
make html
# Deploy production web site
netlify deploy –prod
# Click on the Website URL
Footnotes:
- 1
Visual Studio Code: https://code.visualstudio.com/
- 2
Git: https://git-scm.com/
- 3
GitHub: https://github.com/
- 4
Netlify: https://www.netlify.com
- 5
Netlify CLI Command: https://cli.netlify.com/
- 6
- 7
VScode reStructuredText Extension: <https://marketplace.visualstudio.com/items?itemName=lextudio.restructuredtext>
Home page Web Technology Consulting
