The official website for SSW FireBootCamp - a 12-week intensive fullstack developer training program that transforms aspiring developers into industry-ready professionals.
This website is built with Next.js and powered by TinaCMS for content management, allowing the team to visually edit content directly from the browser.
- Next.js 15 with React 18 and TypeScript
- TinaCMS for visual content editing and management
- Tailwind CSS 4 for styling with custom FireBootCamp components
- GitHub Pages deployment support
- Custom components for program features (hero, skills, pricing, team, testimonials, FAQs)
- Responsive design with modern UI components (Radix UI, Motion animations)
- Mermaid diagram support for technical content
- Git
- Node.js Active LTS
- pnpm package manager
- A TinaCMS account for live editing
Install the project's dependencies:
Note
Do you know the best package manager for Node.js? Using the right package manager can greatly enhance your development workflow. We recommend using pnpm for its speed and efficient handling of dependencies. Learn more about why pnpm might be the best choice for your projects by checking out this rule from SSW.
pnpm install
Run the project locally:
pnpm dev
- http://localhost:3000 - Browse the FireBootCamp website
- http://localhost:3000/admin - Connect to Tina Cloud and enter edit mode
- http://localhost:3000/exit-admin - Log out of Tina Cloud
- http://localhost:4001/altair/ - GraphQL playground to test queries and browse the API documentation
This site can be deployed to GitHub Pages as a static site. To set up deployment:
- In your repository settings, ensure GitHub Pages is enabled and set to deploy from the
gh-pagesbranch - Set up a GitHub Actions workflow (if not already present) to handle the build and deployment process
- Configure the required secrets in Settings | Secrets and variables | Actions:
NEXT_PUBLIC_TINA_CLIENT_IDTINA_TOKENNEXT_PUBLIC_TINA_BRANCH(optional, defaults to main)
Note
Get your TinaCMS credentials from your TinaCloud project - read the docs
Important
GitHub Pages does not support server-side code, so this will run as a static site. Ensure your Next.js configuration is set up for static export.
Create a .env file in the root directory with your TinaCMS credentials:
NEXT_PUBLIC_TINA_CLIENT_ID=<get this from the project you create at app.tina.io>
TINA_TOKEN=<get this from the project you create at app.tina.io>
NEXT_PUBLIC_TINA_BRANCH=<Specify the branch with Tina configured>
Build the project:
pnpm buildFor local development without Tina Cloud:
pnpm build-localTo get help with any TinaCMS challenges you may have:
- Visit the documentation to learn about Tina.
- Join our Discord to share feedback.
- Visit the community forum to ask questions.
- Get support through the chat widget on the TinaCMS Dashboard
- Email us to schedule a call with our team and share more about your context and what you're trying to achieve.
- Search or open an issue if something is not working.
- Reach out on Twitter at @tina_cms.
This project uses Biome for linting and formatting:
pnpm lintTypeScript types are auto-generated from the TinaCMS schema. These are rebuilt automatically when your tina configuration changes.
Install the GraphQL extension to benefit from type auto-completion and GraphQL syntax highlighting.
app/- Next.js app router pages and layoutscomponents/- React components including FireBootCamp-specific blockscontent/- Markdown and JSON content files managed by TinaCMStina/- TinaCMS configuration and schema definitionspublic/- Static assets (images, videos, etc.)
- Framework: Next.js 15 with App Router
- Language: TypeScript
- Styling: Tailwind CSS 4
- CMS: TinaCMS
- UI Components: Radix UI, Headless UI
- Animations: Motion (Framer Motion)
- Code Highlighting: Shiki
- Diagrams: Mermaid
- Package Manager: pnpm
Licensed under the Apache 2.0 license.