Skip to content

Commit

Permalink
tweak make target names for symmetry
Browse files Browse the repository at this point in the history
  • Loading branch information
@ehammond
ehammond committed Dec 9, 2024
1 parent d09c6be commit c3d1088
Show file tree
Hide file tree
Showing 2 changed files with 58 additions and 92 deletions.
29 changes: 15 additions & 14 deletions Makefile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ $(foreach bin,$(REQUIRED_BINS),\
.PHONY: help
help: ## Display this help message
@echo "$(CYAN)getabc.sh$(RESET) development commands:"
@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf " $(BLUE)make %-15s$(RESET) %s\n", $$1, $$2}'
@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf " $(BLUE)make %-20s$(RESET) %s\n", $$1, $$2}'

.PHONY: clean
clean: ## Clean all artifacts and dependencies
Expand All @@ -32,32 +32,33 @@ node_modules: package.json ## Install dependencies

.PHONY: setup
setup: clean node_modules ## Setup/reset development environment
@echo "$(GREEN)Ready for development. Run 'make dev' to start the server.$(RESET)"
@echo "$(GREEN)Ready for development. Run 'make serve-dev' to start the development server.$(RESET)"

# Development
.PHONY: dev
dev: node_modules ## Start development server
@echo "$(GREEN)Starting development server...$(RESET)"
.PHONY: serve-dev
serve-dev: node_modules ## Start development server with hot-reload
@echo "$(GREEN)Starting development server with hot-reload on port 3000...$(RESET)"
@npm run dev

.PHONY: check
check: node_modules ## Run all checks (lint and type-check)
.PHONY: checks
checks: node_modules ## Run all checks (lint and type-check)
@echo "$(GREEN)Running linter...$(RESET)"
@npm run lint || (echo "$(YELLOW)Linting failed. Please fix the issues above.$(RESET)" && exit 1)
@echo "$(GREEN)Checking types...$(RESET)"
@npx tsc --noEmit

# Production build
# Static website build (mimics production)
out: node_modules $(shell find app -type f) next.config.js package.json tsconfig.json
@echo "$(GREEN)Building for production...$(RESET)"
@echo "$(GREEN)Building static website...$(RESET)"
@rm -rf out
@NODE_ENV=production npm run build
@touch out/.nojekyll

.PHONY: build
build: out ## Build for production
.PHONY: build-static
build-static: out ## Build static website to mimic prod
@echo "$(GREEN)Static website generated in 'out' directory$(RESET)"

.PHONY: start
start: out ## Start production server
@echo "$(GREEN)Starting production server...$(RESET)"
.PHONY: serve-static
serve-static: build-static ## Serve static website build locally
@echo "$(GREEN)Starting static website server on port 3001...$(RESET)"
@NODE_ENV=production npx serve@latest out -l 3001
121 changes: 43 additions & 78 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,109 +1,74 @@
# getabc.sh

Web site for abc (AI bash/zsh/tcsh Command)
This repo contains the website for <https://getabc.sh/>

For the actual `abc` software, see <https://github.com/alestic/abc>

## Development Workflow

The project uses a Makefile to standardize development workflows, organized in a logical progression. The build system requires `npm` and `node` to be installed on your system.
The project uses a Makefile to standardize development workflows. The build system requires `npm` and `node` to be installed on your system.

### 1. Setup and Environment
```bash
# First-time setup or reset environment
make setup

# Clean all artifacts and dependencies
make clean
```

### 2. Development
```bash
# Start development server
make dev
## Project Structure

# Run linting and type checks
make check
```
This website is a Next.js project using:
- TypeScript for type safety
- ESLint for code quality
- TailwindCSS for styling
- GitHub Pages for deployment

### 3. Production Testing
## Setup / Cleanup

There are two ways to test production builds:
Setup/reset the development environment:

#### Local Testing
To test the production build locally without GitHub Pages paths:
```bash
# Build static files for local testing
make build-local

# Start local production server
make start
make setup
```
This will serve the site at http://localhost:3000 without GitHub Pages-specific paths.

#### GitHub Pages Preview
To preview how the site will look on GitHub Pages:
```bash
# Build static files with GitHub Pages configuration
make build-gh-pages
Clean all artifacts and dependencies:

# Preview the GitHub Pages version locally
make preview-gh-pages
```bash
make clean
```
This will serve the site at http://localhost:3000 with GitHub Pages paths configured.

### 4. Deployment
## Development

Deployment to GitHub Pages is fully automated using GitHub Actions. Simply push your changes to the `main` branch:
Start the development server with hot-reload for real-time changes:

```bash
git add .
git commit -m "Your commit message"
git push origin main
make serve-dev
```

The GitHub Actions workflow will:
1. Build the site with GitHub Pages configuration
2. Deploy to GitHub Pages automatically
3. Make the site available at your GitHub Pages URL
This will run the site at http://localhost:3000 with live updates as you modify the code, making it ideal for active development.

## Project Structure
Before committing changes, run the checks:

This is a Next.js project using:
- TypeScript for type safety
- ESLint for code quality
- TailwindCSS for styling
- GitHub Pages for deployment
```bash
make checks
```
This will run the linter and type checker to ensure code quality.

## Build Configuration
## Production Testing

The project uses Next.js static exports with specific configurations:
To test how the site will behave in the actual production environment:

```bash
# Build static files (generates production-optimized static assets)
make build-static

### Development
- Local development server runs at the root path
- Images are unoptimized for compatibility with static export
# Start production server to preview the static build
make serve-static
```

### Production
- Builds as static export (`output: 'export'`)
- Two build modes:
1. Local testing: Serves from root path
2. GitHub Pages: Uses configured base path and asset prefix
- Production builds include:
- Static file optimization
- Proper path handling
- `.nojekyll` file for GitHub Pages
This will serve the production-equivalent build at http://localhost:3001, allowing you to verify how the site will actually appear and function when deployed.

## Build Process Details
## Deployment

### Local Testing Build
The local testing build (`make build-local`):
1. Builds static files to `out-local/`
2. Configures for root path serving
3. Optimizes for local testing
Deployment to GitHub Pages is automated using GitHub Actions. Simply push your changes to the `main` branch:

### GitHub Pages Build
The GitHub Pages build (`make build-gh-pages`):
1. Builds static files to `out/`
2. Configures base path and asset prefix for GitHub Pages
3. Adds `.nojekyll` file to bypass GitHub Pages processing
4. Optimizes for GitHub Pages hosting
```bash
git add [files]...
git commit -m "Your commit message"
git push
```

The automated GitHub Actions deployment uses the GitHub Pages build configuration and handles all deployment steps automatically when you push to the main branch.
The GitHub Actions workflow will automatically build and deploy the site to GitHub Pages.

0 comments on commit c3d1088

Please sign in to comment.