{"id":14070212,"url":"https://github.com/profydev/prolog-app","last_synced_at":"2025-07-30T07:30:58.945Z","repository":{"id":39800981,"uuid":"468322990","full_name":"profydev/prolog-app","owner":"profydev","description":"The base application for the upcoming React Job Simulator. Transition from amateur to professional within a single project by working in a real-world work environment.","archived":false,"fork":false,"pushed_at":"2024-06-30T10:42:26.000Z","size":8423,"stargazers_count":328,"open_issues_count":8,"forks_count":102,"subscribers_count":8,"default_branch":"main","last_synced_at":"2024-08-13T07:17:16.781Z","etag":null,"topics":["nextjs","react"],"latest_commit_sha":null,"homepage":"https://profy.dev","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/profydev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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":"2022-03-10T11:56:49.000Z","updated_at":"2024-08-08T09:25:28.000Z","dependencies_parsed_at":"2023-11-15T08:30:56.309Z","dependency_job_id":"41b033ae-b3f1-4e87-81ee-7d931a677d73","html_url":"https://github.com/profydev/prolog-app","commit_stats":null,"previous_names":[],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/profydev%2Fprolog-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/profydev%2Fprolog-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/profydev%2Fprolog-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/profydev%2Fprolog-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/profydev","download_url":"https://codeload.github.com/profydev/prolog-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228102639,"owners_count":17869894,"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":["nextjs","react"],"created_at":"2024-08-13T07:07:34.127Z","updated_at":"2024-12-04T11:31:30.914Z","avatar_url":"https://github.com/profydev.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"This repository is part of the [React Job Simulator](https://profy.dev) where you work in a professional dev environment with advanced tooling and workflows. You implement tasks based on designs starting from small bug fixes to full-blown features. Basically, you learn a lot of the things hands-on that you usually only experience once you joined a professional React team.\n\n## The Application\n\nThe application is an error logging and monitoring tool similar to Sentry or Rollbar. You can find a deployed version of the main branch at [prolog.profy.dev](https://prolog.profy.dev). Note: you have to click the \"Dashboard\" link in the upper right corner to see the app as shown in the screenshot below.\n\n![The running application](docs/app.png)\n\n## Codebase Tour\n\nWatch this video for a tour through the codebase.\n\n[![Codebase tour](docs/codebase-tour.png)](https://youtu.be/nYEZ1vVGYkw)\n\n## Getting Started\n\n### 1. Clone \u0026 Install\n\nThis project is built with Next.js, TypeScript, Cypress \u0026 SCSS modules among others. To start working on the project, first clone the repository on your local machine and install the dependencies.\n\n```bash\nnpm install\n```\n\n### 2. Create .env File\n\n**copy the `.env.template` file to a new file called `.env`.** This file contains the required environment variables that are injected by Next.js via the `dotenv` package.\n\n### 3. Run Development Server\n\nFinally, run the development server:\n\n```bash\nnpm run dev\n```\n\nNow you can open [http://localhost:3000](http://localhost:3000) with your browser to see the application.\n\n## Recommended VS Code Extensions\n\nThis project uses tools like ESLint, Stylelint, and Prettier. To make the most of these tools it's recommended to install the corresponding extensions. For VS Code those are:\n\n- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)\n- [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint)\n- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)\n- [SCSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=mrmlnc.vscode-scss) (e.g. for auto-completion of SCSS variables)\n- [React CSS modules](https://marketplace.visualstudio.com/items?itemName=viijay-kr.react-ts-css) (e.g. to open the CSS class definition with CMD/Ctrl + click and warn about non-existent class names)\n\nThe official Stylelint extension might need some adjustment of your `settings.json` file. If it doesn't work out of the box try adding these lines:\n\n```\n\"css.validate\": false,\n\"less.validate\": false,\n\"scss.validate\": false,\n\"stylelint.validate\": [\"css\", \"scss\"],\n```\n\nAdditional extensions that I find very valuable are\n\n[Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)\n[GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)\n[SVG](https://marketplace.visualstudio.com/items?itemName=jock.svg)\n[GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) (paid)\n\n## Tests\n\nThis project is covered with Cypress tests. Although most tests for production apps are currently written with React Testing Library, Cypress is the best option to get started with testing. When you're new to testing the start can be very cumbersome and feel like you're in a completely new dev environment.\n\nCypress makes it much easier to get started with testing. You still have to get used to the new way of coding but thanks to its awesome UI debugging is easy and very similar to what you're used from your browser.\n\n![Cypress test](docs/cypress.gif)\n\nTo run the Cypress tests on your local machine use this command:\n\n```bash\nnpm run cypress\n```\n\n## Storybook\n\nStorybook is a great tool to document your components and visually test them in isolation. To open Storybook run\n\n```bash\nnpm run storybook\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprofydev%2Fprolog-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprofydev%2Fprolog-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprofydev%2Fprolog-app/lists"}