{"id":26621570,"url":"https://github.com/ajhenry/chronle-reddit","last_synced_at":"2025-06-22T22:06:37.789Z","repository":{"id":283163558,"uuid":"947340098","full_name":"ajhenry/chronle-reddit","owner":"ajhenry","description":"A daily timeline game where you put items in order. Based on the web version of chronle.com","archived":false,"fork":false,"pushed_at":"2025-03-18T21:03:40.000Z","size":11276,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-21T00:37:38.329Z","etag":null,"topics":["daily-game","devvit","historical","reddit"],"latest_commit_sha":null,"homepage":"https://reddit.com/r/chronle","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ajhenry.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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}},"created_at":"2025-03-12T14:32:44.000Z","updated_at":"2025-03-18T21:03:43.000Z","dependencies_parsed_at":"2025-03-18T22:33:54.215Z","dependency_job_id":null,"html_url":"https://github.com/ajhenry/chronle-reddit","commit_stats":null,"previous_names":["ajhenry/chronle-reddit"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ajhenry/chronle-reddit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ajhenry%2Fchronle-reddit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ajhenry%2Fchronle-reddit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ajhenry%2Fchronle-reddit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ajhenry%2Fchronle-reddit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ajhenry","download_url":"https://codeload.github.com/ajhenry/chronle-reddit/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ajhenry%2Fchronle-reddit/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261374413,"owners_count":23148977,"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","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":["daily-game","devvit","historical","reddit"],"created_at":"2025-03-24T09:17:21.539Z","updated_at":"2025-06-22T22:06:32.776Z","avatar_url":"https://github.com/ajhenry.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Chronle for Reddit\n\nA Reddit app built with Devvit that provides an interactive timeline visualization experience. This project is based on the [Devvit Webview React Template](https://github.com/devvit-io/devvit-webview-react).\n\n## Demo\n\n[Demo](https://github.com/user-attachments/assets/1c7e770c-fce1-4d16-a864-fc9a74d42bae)\n\n## Tech Stack\n\n- [Devvit](https://developers.reddit.com/docs/): Reddit's Developer Platform that lets you build powerful apps and experiences to enhance the communities you love.\n- [Vite](https://vite.dev/): Advanced build tool for the web\n- [React](https://react.dev/): UI Library for the web\n- [TailwindCSS](https://tailwindcss.com/): Utility first CSS framework\n\n## Getting Started\n\n\u003e Make sure you have Node 22 downloaded on your machine before running!\n\n```sh\ngit clone https://github.com/ajhenry/chronle-reddit.git\ncd chronle-reddit\nnpm install\n```\n\nBefore continuing, make sure you have a subreddit on Reddit.com where you'll be developing. Go to Reddit.com, scroll the left side bar down to communities, and click \"Create a community.\"\n\nNext, go to the `package.json` and update the `dev:devvit` command with your subreddit name.\n\nFinally go to `devvit.yaml` and name your app. It has to be 0-16 characters. Once you have, click save, and run `npm run upload` from the root of the repository.\n\nNow all you have to do is run `npm run dev` and navigate to the subreddit.\n\nThere is one last gotcha! You need to make a new post before you can see it. You can do so by going to your subreddit, clicking the three dots, and tapping \"Add a daily Chronle\".\n\n## Commands\n\n- `npm run dev`: Starts a development server where you can develop your application live on Reddit.\n- `npm run upload`: Uploads a new version of your app\n- `npm run vite`: Useful to run just the React app on your machine if you need to style things quickly.\n\n## Project Structure\n\nThe application is built using a webview architecture, where the main Devvit app launches a React application that runs in a webview.\n\n### Main App Structure\n\n- `main.tsx`: The main entry point of the application, containing the launch button for the webview\n- `Preview.tsx`: Loading state component until the game launches\n- `core/`: Contains API functions and core business logic\n- `utils/`: Helper functions for API calls and other utilities\n- `constants.ts`: Environment configuration for Devvit\n- `assets/`: Static assets and resources\n- `services/`: Services for the API/redis\n\n### Webview Application\n\nThe webview application is a full-featured React application with the following structure:\n\n- `main.tsx`: Entry point that initializes the webview and sends ready message to Devvit\n- `/pages`: Pages for the webview\n- `/components`: Reusable UI components\n- `/hooks`: Custom React hooks for shared logic\n- `/types`: TypeScript type definitions\n- `/utils`: Utility functions and helpers\n- `/lib`: Third party libraries\n\n## Features\n\n- Consistent styling with TailwindCSS\n- Smooth animations with Framer Motion\n- Drag and drop functionality with dnd-kit\n- Theme support with next-themes\n- Toast notifications with Sonner\n\n## Development\n\nThe project uses a modern development setup with:\n\n- TypeScript for type safety\n- Vite for fast development and building\n- TailwindCSS for styling\n- Concurrent development servers for both Devvit and the webview app\n- Hot module replacement for rapid development\n\n## Contributing\n\n1. Fork the repository\n2. Create your feature branch (`git checkout -b feature/amazing-feature`)\n3. Commit your changes (`git commit -m 'Add some amazing feature'`)\n4. Push to the branch (`git push origin feature/amazing-feature`)\n5. Open a Pull Request\n\n## License\n\nThis project is licensed under the BSD-3-Clause License - see the LICENSE file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fajhenry%2Fchronle-reddit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fajhenry%2Fchronle-reddit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fajhenry%2Fchronle-reddit/lists"}