Skip to main content

Develpopment Tools

VScode​

info

Visual Studio Code (VScode) is a Microsoft product.

It has become the goto editor for many. It is free, built on open source, and runs everywhere.

VScode is the command and control center for the website development stack.

The development command and control tasks are:

  • Editing Markdown and MDX text and Troika web programming materials
  • Use git and GitHub to manage project files. Git is built-in and optimized to work with Microsoft GitHub
  • Editor tool extensions continually check for syntax and other errors
  • Live edit browser previews show how edits will look when deployed
  • Deploy secure website previews to the Internet for stakeholders
  • Deploy production website to the Internet
  • Built-in command shell
  • And much more

Extensions​

Useful extensions are:

  • Dark+ Material.
    The default Dark+ theme, using Material's color palette

  • ESlint.
    Integrates ESLint JavaScript into VS Code

  • GitHub Repositories.
    Remotely browse and edit any GitHub repository

  • Lorem Text Generator
    Lorem text generator extension for VScode

  • Markdown All in One
    All you need for Markdown (keyboard shortcuts, table of contents, auto preview and more)

  • MDX
    MDX for Visual Studio Code

  • Rainbow Brackets
    Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets

  • Todo Tree
    This extension quickly searches the local repository workspace for comment tags like TODO and FIXME, and displays them in a tree view in the activity bar

  • VScode-icons
    Icons for Visual Studio Code

Git and GitHub References​

tip

These Git and Github references contain concepts and commands:

GitHub​

The core technologies of Iterative Development are, Git and GitHub. The central project repository is controlled by the project gatekeeper, and a content delivery network, like Cloudflare, where Internet production websites and individual team private Preview Internet websites, are deployed.

GitHub is a Distributed Version Control Systems enabling multiple teams to work separately on the same project without having an impact on the work of others. GitHub manages an online web hosted central project repository containing all project files. It is a unified source of truth. It helps teams collaborate and maintain the entire history of project file changes.

It helps answer the questions for the lifetime of the project who changed what, where, when, and why?

Team members use the Website Development Stack to develop and deploy websites to the Internet.

The GitHub Workflow​

GitHub workflow is centered on Pull Request The GitHub workflow works with collaborating team members contributing to the central project repository using the Forks. It is centered on the topic Branches workflow.

A summary of GitHub workflow for each team member is:

  1. Fork the central project repository creating a local project repository in individual team members GitHub account
  2. Clone the forked local project repository in team member GitHub account to workstation
  3. Creates a topic Branch off the cloned local project repository main branch
  4. Make topic edits and commits
  5. Push after each commit to the cloned local project repository in GitHub account
  6. Periodically Pull from the central project repository. The develop branch will have merged accepted Pull Requests
  7. Periodically deploy local project repository to a private Preview website without disturbing other developers work or the production version, for stake holders viewing and feedback. This reduces the Pull Request evaluation time because stake holders interested in topics can see how they are progressing and working with the website.
  8. Open a Pull Request on the GitHub local project repository to begin the process of integrating the local project repository with the central project repository
  9. Team members discuss, and optionally continue committing on Pull Requests.

The project gatekeeper merges or closes Pull Requests to the central project repository, and deploys the central project repository to a private Preview website for stack holders viewing. The teams and gatekeeper continues the GitHub workflow process until stack holders agree the central project repository is ready for release to the public internet

Teams may Pull the central project repository at anytime to view and test other topic branches.

Git​

Git is a free and open source distributed version control system designed to handle everything from small to large projects with speed and efficiency.

Git Desktop​

Git Desktop is an alternative to using VScode built-in Git commands. It abstract Github and more Git commands. It interacts with GitHub using a GUI instead of the command line or a web browser. It is a Microsoft product available on Mac and Windows.

GitHub Desktop and VSCode documents explain how to use GitHub Desktop with VScode.

iA Writer​

Editing Markdown / MDX website pages and blog posts using iA Writer is faster because of focus and grammar features with live preview.

  • iA Writer is a Markdown Writing app:

    • Faster way to write MDX website material
    • Extensive Style Check
    • Focus
      • Sentence
      • Paragraph
    • Available for Mac, iOS, Windows, and Android

    The Mac iA Writer stores files in iCloud. They are available for editing using supported devices when there is an internet connection.

Chronosync​

When one or more pages have been edited using iA Writer, the ChronoSync Mac app is used to synchronize files between iA Writer and the local repository. Since the iA Writer files are store in iCloud, they are available for editing using supported devices when there is an internet connection.

If edits have been made to files the local repository, use ChronoSync to synchronize them to iA Writer.

Last updated on