Updating My Site Using Bolt, VS Code, and GitHub
Introduction
Today, I'll share my workflow for updating my personal website using Bolt, VS Code, and GitHub. This process ensures smooth development and version control while maintaining a professional web presence.
1. Content Creation and Updates
- Created and edited content locally
- Organized content in structured formats (Markdown, JSON, HTML)
2. Using Bolt for Design and Generation
- Accessed Bolt at bolt.new
- Imported content and code
- Previewed and formatted site appearance
- Generated and downloaded site files
3. Local Project Integration
- Located downloaded Bolt folder (Gump Folder)
- Opened GitHub-linked project in VS Code
- Carefully copied updated site files (particularly src/ directory)
- Preserved .git directory for version control
4. Version Control with Git
After opening VS Code and checking Git status, I followed these steps for version control:
git status
git add .
git commit -m "Updated site with latest Bolt export (April 17)" 5. Branch Management and Push
When pushing changes, I encountered and resolved a branch naming issue:
# Initial attempt
git push origin main
# Error received
error: src refspec main does not match any
# Checked current branch
git branch
* master
# Successfully pushed to correct branch
git push origin master 6. GitHub Verification
- Verified updates on GitHub repository
- Confirmed commit message and file updates
- Checked src/ directory modifications
7. Deployment Options
For public access, the site can be deployed via:
- GitHub Pages at jamesmnguyen704.github.io/GUMP/
- Alternative hosting platforms like Netlify or Vercel
Pro Tips
- Always verify correct file copying into Git-tracked directories
- Use git status frequently to monitor changes
- Maintain clear, dated commit messages for change tracking
- Double-check branch names before pushing changes