This is a personal homepage built with Jekyll, styled with Tailwind CSS (via CDN), and managed with Decap CMS. It's designed to be hosted on GitHub Pages with automated deployment.
- Jekyll Static Site: Fast, secure static site generation
- Tailwind CSS: Modern utility-first CSS framework
- Decap CMS: User-friendly content management system
- Automated Deployment: GitHub Actions deploy to GitHub Pages
- Local Development: Full CMS functionality for local editing
- Cross-Platform: Works on macOS, Linux, and Windows
- Ruby 3.1: Modern Ruby version with reliable dependencies
To set up and run this site locally, you'll need Ruby, Bundler, and Jekyll.
-
Clone the repository:
git clone https://github.com/Czaruno/LarryVelez.git cd LarryVelez -
Install Ruby and Bundler: The site requires Ruby 3.1+ (matching the GitHub Actions workflow).
For macOS users:
# Install Ruby via Homebrew brew install ruby@3.1 # Add Ruby to your PATH (add to ~/.zshrc for persistence) export PATH="/usr/local/opt/ruby@3.1/bin:$PATH" # Verify Ruby version ruby -v # Should show 3.1.x # Install Bundler gem install bundler
-
Install Jekyll and other dependencies: Navigate to the project directory and run:
bundle install
Troubleshooting: If you encounter platform-specific Gemfile.lock errors:
rm Gemfile.lock bundle install
-
Choose your development mode:
For Jekyll development only:
./serve.sh # Site available at http://localhost:4000For Jekyll + CMS editing (recommended):
./serve-with-cms.sh # Site: http://localhost:4000 # CMS: http://localhost:4000/admin/
Manual method:
export PATH="/usr/local/opt/ruby@3.1/bin:$PATH" # If using Homebrew Ruby bundle exec jekyll serve --livereload
- Content Editing: Use the local CMS at
http://localhost:4000/admin/for easy content editing - Code Changes: Edit files directly and Jekyll will auto-reload
- Deploy: Push changes with
git pushto trigger automatic deployment - Live Site: Changes appear at
https://czaruno.github.iowithin 1-2 minutes
Deployment is automated via GitHub Actions. The workflow:
- Triggers on push to the
mainbranch of the privateCzaruno/LarryVelezrepository - Builds the Jekyll site using Ruby 3.1
- Deploys the built site to the public
Czaruno/czaruno.github.iorepository
Key Configuration:
- The workflow uses
peaceiris/actions-gh-pages@v3.9.3action - Authentication is done via a Personal Access Token (PAT)
- The PAT must be stored as a repository secret named
GH_PAGES_PAT
_config.yml: Jekyll configuration.index.md: Main homepage content and structure._layouts/: HTML layouts (e.g.,default.html).assets/: CSS, images, and other static files.admin/: Decap CMS configuration and entry point.Gemfile: Ruby gem dependencies..github/workflows/: GitHub Actions workflows for CI/CD.serve.sh: Convenience script for running local development server.serve-with-cms.sh: Script to run both Jekyll and Decap CMS local backend.CLAUDE.md: Development guidelines for Claude Code AI assistant.
Important: Please ensure any previous "Content Management" section referring to GitHub Authentication (via OAuth) or Git Gateway is removed or updated.
This site uses Decap CMS with the github backend to manage content. This means you'll authenticate with your GitHub account to use the CMS.
To enable this, you need to set up a GitHub OAuth Application:
-
Navigate to GitHub Developer Settings:
- Go to your GitHub profile settings.
- Select "Developer settings" from the left sidebar.
- Go to "OAuth Apps".
-
Create a New OAuth App:
- Click "New OAuth App" or "Register a new application".
- Application name: Something descriptive (e.g., "LarryVelez CMS", "LarryVelez Site Editor").
- Homepage URL:
https://czaruno.github.io(your public site URL). - Application description: (Optional) A brief description.
- Authorization callback URL: This is crucial. Set this to
https://api.netlify.com/auth/callback. Decap CMS uses this Netlify-hosted service as a proxy for the OAuth flow with GitHub.
-
Get Credentials:
- Once the app is created, you'll see a Client ID and you can generate a Client Secret.
-
Using Credentials:
-
Decap CMS, when configured for the
githubbackend, will prompt users to log in via GitHub. GitHub will then show your OAuth app's consent screen. TheAuthorization callback URLyou set tells GitHub where to send the user back after they approve. Netlify'sapi.netlify.com/auth/callbackservice handles the token exchange and forwards necessary information to the CMS running on your site. -
You generally do not need to embed the Client ID or Secret directly into your
admin/config.ymlor site files when using this standard callback URL. -
Local Development with
local_backend:- The CMS is configured for local development with
local_backend: true, which bypasses GitHub OAuth when running locally. - Quick Start: Use the provided script to run both Jekyll and CMS servers:
This starts both the Jekyll development server and the Decap CMS local backend server.
./serve-with-cms.sh
- Manual Setup: Alternatively, run both servers in separate terminals:
# Terminal 1: Decap CMS backend npx decap-server # Terminal 2: Jekyll server ./serve.sh
- Usage: Access the CMS at
http://localhost:4000/admin/and click the login button for automatic authentication. - Workflow: Changes made in the CMS are committed to your local Git repository. Push changes with
git pushto trigger automatic deployment.
- The CMS is configured for local development with
-
Production CMS Limitations:
- The CMS interface at
https://czaruno.github.io/admin/has authentication limitations due to GitHub Pages hosting constraints. - Recommended Workflow: Use local development for content editing, then push changes to deploy.
- Alternative: Edit the
index.mdfile directly on GitHub for quick changes. - A helpful notice is displayed on the production CMS explaining these limitations (hidden on localhost).
- The CMS interface at
-
Access the CMS by navigating to /admin/ on your site (e.g., when deployed, https://czaruno.github.io/admin/ or locally http://localhost:4000/admin/).
The site is automatically built and deployed from the Czaruno/LarryVelez (private) repository to the Czaruno/czaruno.github.io (public) repository using a GitHub Actions workflow.
To enable the workflow to push to your public repository, you need to create a Personal Access Token (PAT):
-
Generate a Personal Access Token (PAT) on GitHub:
- Go to your GitHub profile settings.
- Select "Developer settings" from the left sidebar.
- Go to "Personal access tokens" -> "Tokens (classic)". (Or "Fine-grained tokens" if you prefer, but classic is simpler for
reposcope). - Click "Generate new token" (select "Generate new token (classic)").
- Note: Give your token a descriptive name (e.g., "GH_PAGES_DEPLOY_LarryVelez").
- Expiration: Choose an appropriate expiration period.
- Scopes: Select the
reposcope. This will grant full control of public and private repositories. Be careful with this token as it's powerful.- If you use Fine-grained tokens, you can restrict it more precisely to only the
Czaruno/czaruno.github.iorepository with "Contents: Read & Write" permissions. - Important: The workflow uses the
personal_tokenparameter (notpersonal_access_token)
- If you use Fine-grained tokens, you can restrict it more precisely to only the
- Click "Generate token". Copy the token immediately. You will not be able to see it again.
-
Add the PAT as a Secret in the
Czaruno/LarryVelezRepository:- Navigate to your private
Czaruno/LarryVelezrepository on GitHub. - Go to "Settings" -> "Secrets and variables" -> "Actions".
- Click "New repository secret".
- Name:
GH_PAGES_PAT(this must match the name used in the workflow file:secrets.GH_PAGES_PAT). - Value: Paste the PAT you copied.
- Click "Add secret".
- Navigate to your private
The GitHub Actions workflow will now use this token to authenticate and push the built static site files to your czaruno.github.io repository.
The Czaruno/czaruno.github.io repository serves as the public hosting location for your GitHub Pages site.
Important Considerations:
- Automated Deployment Target: This repository's content is automatically generated and overwritten by the GitHub Actions workflow running in the private
Czaruno/LarryVelezrepository. - Do Not Edit Manually: Avoid making manual changes (e.g., editing HTML files, adding assets directly) in the
Czaruno/czaruno.github.iorepository. Any such changes will be lost during the next automated deployment. All content and structural changes should be made in the privateCzaruno/LarryVelezsource repository. - GitHub Pages Configuration:
- Ensure GitHub Pages is enabled for the
Czaruno/czaruno.github.iorepository. - It should be configured to serve from the
mainbranch (ormasterif that's what your public repo uses) and the/(root)folder.
- Ensure GitHub Pages is enabled for the
- Initial Setup: If this is the first time deploying, the GitHub Action will create the necessary branch and files. You just need to ensure the repository exists and GitHub Pages is set to watch the correct branch once content is pushed.