Overview
README Maker is a small React side project that lets you assemble a GitHub profile README without hand-writing markdown. You pick one of several templates (minimal, badge-heavy, timeline, statistics), fill a short form for each content block, and instantly preview the final README before exporting it to your clipboard or downloading the .md file.
Template System
- Template cards show live previews so you can compare layouts before selecting one.
- Each template defines slots (bio, stacks, badges, pinned projects, GitHub stats). Form fields map to those slots so the UI guides what to fill in.
- Markdown rendered preview updates on every keystroke and includes copy/download buttons so you can ship immediately.
Technologies
- React with hooks for component state and live preview rendering
- Redux Toolkit to persist template selections and form data across steps
- React Router for multi-step flow between template gallery, editor, and export screens
- Tailwind CSS utility classes for quickly theming each template variant
- LocalStorage sync middleware so your answers survive refreshes
Outcome
The tool has been shared with hackathon friends and helped dozens of students publish their first polished GitHub profiles. Because templates are simple JSON configs, I can add new layouts in minutes and the Redux store automatically supports the new slots.