{"id":31025745,"url":"https://github.com/e-roy/go-react-blog","last_synced_at":"2025-09-13T17:12:10.969Z","repository":{"id":313473020,"uuid":"1051059534","full_name":"e-roy/go-react-blog","owner":"e-roy","description":null,"archived":false,"fork":false,"pushed_at":"2025-09-06T09:39:29.000Z","size":155,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-06T10:17:55.592Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/e-roy.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-05T11:30:29.000Z","updated_at":"2025-09-06T09:39:32.000Z","dependencies_parsed_at":"2025-09-06T10:17:57.609Z","dependency_job_id":"01bded67-121d-4b3a-abee-012d3e70099e","html_url":"https://github.com/e-roy/go-react-blog","commit_stats":null,"previous_names":["e-roy/go-react-blog"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/e-roy/go-react-blog","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e-roy%2Fgo-react-blog","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e-roy%2Fgo-react-blog/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e-roy%2Fgo-react-blog/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e-roy%2Fgo-react-blog/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/e-roy","download_url":"https://codeload.github.com/e-roy/go-react-blog/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e-roy%2Fgo-react-blog/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":274997547,"owners_count":25387934,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-13T02:00:10.085Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-09-13T17:12:08.538Z","updated_at":"2025-09-13T17:12:10.905Z","avatar_url":"https://github.com/e-roy.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Go + React Blog Platform\n\nA lightweight, full-stack blog platform built with **Go** for the backend and **React + TypeScript + Vite + Tailwind CSS** for the frontend. Features server-side rendering (SSR) with embedded data for optimal performance and SEO. This project serves as both a practical blog solution and a learning journey for Go development.\n\n## 🚀 Features\n\n- **Backend**: Go HTTP server with file-based storage (no database required)\n- **Frontend**: Modern React application with TypeScript\n- **Server-Side Rendering (SSR)**: Go backend serves fully rendered HTML with embedded data\n- **Blog Management**: Create, edit, and delete blog posts through web interface\n- **SEO-Friendly**: Human-readable URLs, canonical links, and comprehensive meta tags\n- **Social Media Ready**: Open Graph and Twitter Card meta tags for rich sharing\n- **Markdown Support**: Rich text editing with live preview\n- **Type Safety**: Auto-generated TypeScript types from Go backend\n- **File Storage**: Markdown content with JSON metadata\n- **Responsive Design**: Works on desktop, tablet, and mobile\n- **Hot Reloading**: Development mode with Vite dev server integration\n- **Low Cost**: Designed for Railway deployment without database dependencies\n\n## 🏗️ Project Structure\n\n```\ngo-react/\n├── backend/                 # Go backend server\n│   ├── models/             # Data structures and interfaces\n│   ├── handlers/           # HTTP request handlers\n│   ├── storage/            # File-based blog storage\n│   ├── routes/             # API routing configuration\n│   ├── middleware/         # CORS and logging middleware\n│   ├── templates/          # HTML templates for SSR\n│   │   ├── index.html      # Home page template\n│   │   ├── blog.html       # Blog post template\n│   │   ├── edit.html       # Edit page template\n│   │   └── new.html        # New blog template\n│   ├── tools/              # TypeScript type generator\n│   ├── data/               # Blog content storage\n│   │   └── {slug}/         # Individual blog directories\n│   │       ├── content.md  # Markdown content\n│   │       └── metadata.json # Blog metadata\n│   ├── go.mod              # Go module definition\n│   ├── main.go             # Main server file\n│   └── README.md           # Backend documentation\n├── frontend/                # React frontend application\n│   ├── app/\n│   │   ├── components/     # React components\n│   │   ├── pages/          # Page components (no client-side routing)\n│   │   ├── lib/            # API client and utilities\n│   │   ├── types/          # TypeScript types\n│   │   └── main.tsx        # React entry point\n│   ├── package.json        # Frontend dependencies\n│   ├── vite.config.ts      # Vite configuration with proxy\n│   ├── tailwind.config.js  # Tailwind CSS config\n│   └── README.md           # Frontend documentation\n└── README.md               # This file\n```\n\n## 🛠️ Tech Stack\n\n### Backend\n\n- **Go 1.22+** - Programming language\n- **Gorilla Mux** - HTTP router and URL matcher\n- **HTML Templates** - Server-side rendering with Go templates\n- **File-based Storage** - Markdown + JSON metadata (no database)\n- **UUID** - Unique identifiers for blog posts\n- **CORS** - Cross-origin resource sharing support\n- **Type Generation** - Automatic TypeScript type generation\n- **Dynamic Asset Loading** - Automatic detection of built frontend assets\n\n### Frontend\n\n- **React 19** - Modern React with hooks and patterns\n- **TypeScript** - Type safety with auto-generated types\n- **Vite** - Fast build tool and dev server with hot reloading\n- **Tailwind CSS** - Utility-first CSS framework\n- **Embedded Data** - Server-side data injection for instant loading\n- **Axios** - HTTP client for API calls\n\n## 🚀 Quick Start\n\n### Prerequisites\n\n- **Go 1.22+** - [Download here](https://golang.org/dl/)\n- **Node.js 18+** - [Download here](https://nodejs.org/)\n\n### Development Mode (Hot Reloading)\n\nFor development with hot reloading:\n\n```bash\n# Start both backend and frontend\n.\\dev.bat           # Windows\n# or\n./dev.sh            # Linux/Mac\n```\n\nThis will start:\n\n- **Go backend** on http://localhost:8080 (with SSR and embedded data)\n- **Vite dev server** on http://localhost:5173 (for hot reloading)\n\n### Production Mode\n\nFor production testing:\n\n```bash\n# Build and run with Docker\ndocker build -t go-react-app .\ndocker run -p 8080:8080 go-react-app\n```\n\n### Manual Setup\n\n1. **Start the Go Backend**\n\n```bash\ncd backend\ngo mod tidy          # Download dependencies\ngo run main.go       # Start the server\n```\n\n2. **Start the React Frontend** (for development)\n\n```bash\ncd frontend\nnpm install          # Install dependencies\nnpm run dev         # Start development server\n```\n\n### Access the Application\n\n- **Development**: http://localhost:8080 (Go backend with SSR)\n- **Hot Reloading**: http://localhost:5173 (Vite dev server)\n- **Production**: http://localhost:8080 (Docker container)\n\n## 📡 API Endpoints\n\nThe Go backend provides these REST endpoints:\n\n- `GET /api/health` - Health check\n- `POST /api/blogs` - Create a new blog post\n- `PUT /api/blogs/{slug}` - Update blog post by slug\n- `DELETE /api/blogs/{slug}` - Delete blog post by slug\n\n### Server-Side Rendered Routes\n\n- `GET /` - Home page with all blogs (SSR with embedded data)\n- `GET /blogs/{slug}` - Individual blog post (SSR with embedded data)\n- `GET /blogs/new` - New blog form\n- `GET /blogs/{slug}/edit` - Edit blog form\n- `GET /sitemap.xml` - XML sitemap for SEO\n\n## 🎯 What You'll Learn\n\n### Go Backend\n\n- HTTP server setup with Go\n- Server-side rendering (SSR) with HTML templates\n- File-based storage (no database required)\n- RESTful API design with slug-based routing\n- JSON handling and structs\n- Interface-based architecture\n- Error handling patterns\n- Concurrency with goroutines and mutexes\n- Type generation for frontend integration\n- Middleware (CORS, logging)\n- Dynamic asset loading and template rendering\n- SEO optimization with meta tags and sitemaps\n\n### React Frontend\n\n- Modern React 19 with hooks\n- TypeScript integration with auto-generated types\n- API communication with Axios\n- Markdown editing and preview\n- Form handling and validation\n- Responsive UI design with Tailwind CSS\n- State management (no client-side routing)\n- Component composition and reusability\n- Embedded data consumption from SSR\n\n### Full-Stack Integration\n\n- Type-safe API communication\n- Automatic type synchronization\n- SEO-friendly URL structure with server-side rendering\n- File-based content management\n- Embedded data injection for instant loading\n- Development mode with hot reloading\n- Production optimization with Docker\n- Railway deployment preparation\n\n## 🔧 Development\n\n### Backend Development\n\n```bash\ncd backend\ngo run main.go          # Run server\ngo mod tidy             # Update dependencies\ngo fmt                  # Format code\ngo vet                  # Check for issues\n```\n\n### Frontend Development\n\n```bash\ncd frontend\nnpm run dev             # Development server\nnpm run build           # Production build\nnpm run preview         # Preview production build\nnpm run lint            # Run ESLint\n```\n\n## 🌟 Key Features Demonstrated\n\n1. **Server-Side Rendering**: Go backend serves fully rendered HTML with embedded data\n2. **Blog Management**: Complete CRUD operations for blog posts\n3. **SEO Optimization**: Meta tags, canonical URLs, Open Graph, and XML sitemaps\n4. **SEO-Friendly URLs**: Human-readable slugs instead of IDs\n5. **Markdown Support**: Rich text editing with live preview\n6. **File-based Storage**: No database required, content stored as files\n7. **Type Safety**: Auto-generated TypeScript types from Go backend\n8. **Responsive Design**: Works perfectly on all devices\n9. **Hot Reloading**: Development mode with instant frontend updates\n10. **Web-based Editing**: All content management through the frontend\n11. **Low Cost Deployment**: Optimized for Railway without database costs\n\n## 📚 Learning Resources\n\n### Go\n\n- [Go Official Tutorial](https://tour.golang.org/)\n- [Go by Example](https://gobyexample.com/)\n- [Effective Go](https://golang.org/doc/effective_go.html)\n\n### React + TypeScript\n\n- [React Documentation](https://react.dev/)\n- [TypeScript Handbook](https://www.typescriptlang.org/docs/)\n- [Vite Guide](https://vitejs.dev/guide/)\n- [Tailwind CSS](https://tailwindcss.com/docs)\n\n## 🤝 Contributing\n\nThis is an open-source learning project! Feel free to:\n\n- Add new blog features (comments, categories, tags)\n- Improve the markdown editor\n- Implement testing\n- Optimize performance\n- Add authentication\n- Improve SEO features\n- Add database support as an option\n\n## 📄 License\n\nThis project is open source and available under the [MIT License](LICENSE).\n\n---\n\n**Happy coding! 🎉**\n\nBuilt with ❤️ using Go and React\n\n_This project serves as both a practical blog platform and a comprehensive learning resource for Go development. Perfect for developers looking to build lightweight, cost-effective blogs without database dependencies._\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fe-roy%2Fgo-react-blog","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fe-roy%2Fgo-react-blog","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fe-roy%2Fgo-react-blog/lists"}