Creating a Personal Website for Documentation

Creating a personal documentation website for this course involves using platforms like Google Sites, GitLab-hosted HTML sites, or other web tools. The goal is to record project progress, share techniques, and provide evidence for evaluation.

Purpose and Format

• Documentation Website: Build a site with weekly project updates, photos, code, design files, and reflections—mirroring a Wikipedia entry in clarity and completeness.
• Evaluation: The site serves as proof of work for course assessment and a portfolio for future use.

Common Platforms

• Google Sites
  Workflow:
  • Set up a site from a template or from scratch.
  • Add pages for assignments/weeks, embedding images, videos, and links to files.
  • Publish updates live with easy drag-and-drop content management.
  Pros: No coding required, rapid setup, good for beginners.
  Use Case: Suitable for those who want a low-barrier, visually organized documentation and don’t need advanced custom features.
• GitLab HTML Sites
  Workflow:
  • Use Git for version control and host the site repo on GitLab
  • Build pages using HTML/CSS or Markdown (often with static site generators like MkDocs, Jekyll, or VitePress).
  • Edit locally with editors (VSCode), preview changes, and push via Git commands.
  • SSH keys secure workflow and automate deployments; server updates site with every push.
  Pros: Flexible design, powerful version control, collaboration, integrates code and data files.
  Use Case: Ideal for advanced documentation, code tracking, open-source projects, or students comfortable with web development basics.
• Other Tools (Canva, Squarespace, Portfolio Builders)
  Workflow:
  • Choose a portfolio or website template.
  • Customize with drag-and-drop, upload photos, add text and page navigation.
  • Publish for easy sharing with evaluators, peers, and public.
  Pros: Rapid setup, visually appealing, good for non-technical users.
  Use Case: Personal portfolio or secondary showcase for Fab Academy outcomes.

General Site Creation Steps

1. Plan Your Structure: Outline weekly assignment pages, a main page, project gallery, and links to code/files.
2. Prepare Tools: Install Git, VSCode, or choose your preferred builder.
3. Create Content: Write descriptive guides, add images/videos, link CAD and code files; document failures and how you solved them.
4. Publish and Maintain: Commit and push changes (Git workflow) or hit “publish” (Google Sites/Canva). Regularly update with new work in progress.
5. Reference Peers: Always reference the work of others.

Example of what your documentation should look like:

• Each assignment or project should have the following information: “If You Didn’t Document Then It Didn’t Happen.” More detail is better than not enough.
• Project Title or Assignment: e.g., “CAD Design for Capstone Project”
• Summary: Short description and representative image.
• Steps:
  1. Description of each step with explanatory text.
• Problems faced and solutions:
  • Problem description
  • Solution found
• Machines and software used and settings:
  • Machine used
  • Spindle Speed
  • Feed Rate
  • Power
• Links for other sources / useful information:
  • Link 1
  • Link 2
• Original Design files:
  • CAD file
  • Electronics Schematic (where applicable)
  • Electronics board (where applicable)
  • Code (where applicable)