{"id":31227609,"url":"https://github.com/nemanjam/tiangolo-starter-nextjs","last_synced_at":"2025-09-22T04:59:39.172Z","repository":{"id":315709185,"uuid":"1060567219","full_name":"nemanjam/tiangolo-starter-nextjs","owner":"nemanjam","description":null,"archived":false,"fork":false,"pushed_at":"2025-09-20T06:52:46.000Z","size":14062,"stargazers_count":0,"open_issues_count":17,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-20T08:37:15.305Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/nemanjam.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","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},"funding":{"github":["tiangolo"]}},"created_at":"2025-09-20T06:35:25.000Z","updated_at":"2025-09-20T06:52:50.000Z","dependencies_parsed_at":"2025-09-20T08:37:34.197Z","dependency_job_id":"32bd89c7-d3f0-4bae-bcd9-fc0dc153e4af","html_url":"https://github.com/nemanjam/tiangolo-starter-nextjs","commit_stats":null,"previous_names":["nemanjam/tiangolo-starter-nextjs"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/nemanjam/tiangolo-starter-nextjs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nemanjam%2Ftiangolo-starter-nextjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nemanjam%2Ftiangolo-starter-nextjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nemanjam%2Ftiangolo-starter-nextjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nemanjam%2Ftiangolo-starter-nextjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nemanjam","download_url":"https://codeload.github.com/nemanjam/tiangolo-starter-nextjs/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nemanjam%2Ftiangolo-starter-nextjs/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":276348331,"owners_count":25626605,"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-22T02:00:08.972Z","response_time":79,"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-22T04:59:38.098Z","updated_at":"2025-09-22T04:59:39.152Z","avatar_url":"https://github.com/nemanjam.png","language":"TypeScript","funding_links":["https://github.com/sponsors/tiangolo"],"categories":[],"sub_categories":[],"readme":"# FastAPI Project - Frontend (Next.js)\n\nThe frontend is built with [Next.js 15](https://nextjs.org/), [React](https://reactjs.org/), [TypeScript](https://www.typescriptlang.org/), [TanStack Query](https://tanstack.com/query), [Tailwind CSS](https://tailwindcss.com/), and [shadcn/ui](https://ui.shadcn.com/).\n\n## Frontend development\n\nBefore you begin, ensure that you have either the Node Version Manager (nvm) or Fast Node Manager (fnm) installed on your system.\n\n* To install fnm follow the [official fnm guide](https://github.com/Schniz/fnm#installation). If you prefer nvm, you can install it using the [official nvm guide](https://github.com/nvm-sh/nvm#installing-and-updating).\n\n* After installing either nvm or fnm, proceed to the `frontend-nextjs` directory:\n\n```bash\ncd frontend-nextjs\n```\n* If the Node.js version specified in the `.nvmrc` file isn't installed on your system, you can install it using the appropriate command:\n\n```bash\n# If using fnm\nfnm install\n\n# If using nvm\nnvm install\n```\n\n* Once the installation is complete, switch to the installed version:\n\n```bash\n# If using fnm\nfnm use\n\n# If using nvm\nnvm use\n```\n\n* Within the `frontend-nextjs` directory, install the necessary NPM packages:\n\n```bash\nnpm install\n```\n\n* And start the live server with the following `npm` script:\n\n```bash\nnpm run dev\n```\n\n* Then open your browser at http://localhost:3000/.\n\nNotice that this live server is not running inside Docker, it's for local development, and that is the recommended workflow. Once you are happy with your frontend, you can build the frontend Docker image and start it, to test it in a production-like environment. But building the image at every change will not be as productive as running the local development server with live reload.\n\nCheck the file `package.json` to see other available options.\n\n### Technology Stack\n\nThis Next.js frontend uses:\n\n- **Next.js 15** with App Router for the React framework\n- **Tailwind CSS v4** for styling with modern CSS features\n- **shadcn/ui** for beautiful, accessible UI components\n- **Lucide React** for consistent iconography\n- **TanStack Query** for server state management\n- **TypeScript** for type safety\n- **Generated API Client** for backend integration\n\n### Removing the frontend\n\nIf you are developing an API-only app and want to remove the frontend, you can do it easily:\n\n* Remove the `./frontend-nextjs` directory.\n\n* In the `docker-compose.yml` file, remove the whole service / section `frontend-nextjs`.\n\n* In the `docker-compose.override.yml` file, remove the whole service / section `frontend-nextjs`.\n\nDone, you have a frontend-less (api-only) app. 🤓\n\n---\n\nIf you want, you can also remove the `FRONTEND` environment variables from:\n\n* `.env`\n* `./scripts/*.sh`\n\nBut it would be only to clean them up, leaving them won't really have any effect either way.\n\n## Generate Client\n\n### Automatically\n\n* Activate the backend virtual environment.\n* From the top level project directory, run the script:\n\n```bash\n./scripts/generate-client.sh\n```\n\n* Commit the changes.\n\n### Manually\n\n* Start the Docker Compose stack.\n\n* Download the OpenAPI JSON file from `http://localhost/api/v1/openapi.json` and copy it to a new file `openapi.json` at the root of the `frontend-nextjs` directory.\n\n* To generate the frontend client, run:\n\n```bash\nnpm run generate-client\n```\n\n* Commit the changes.\n\n## Features\n\nThis Next.js frontend includes:\n\n- **Authentication**: JWT-based authentication with login/logout functionality\n- **Dashboard**: Modern dashboard with sidebar navigation\n- **User Management**: User profile and settings management\n- **Responsive Design**: Mobile-first responsive design with dark mode support\n- **Type Safety**: Full TypeScript integration with generated API types\n- **Modern UI**: Beautiful components built with shadcn/ui and Tailwind CSS\n\n## Project Structure\n\n```\nfrontend-nextjs/\n├── app/                    # Next.js App Router pages\n├── components/             # Reusable React components\n│   └── ui/                # shadcn/ui components\n├── lib/                   # Utility functions and configurations\n├── hooks/                 # Custom React hooks\n├── client/                # Generated API client\n├── public/                # Static assets\n└── styles/                # Global styles and Tailwind config\n```\n\n## Development\n\n### Adding New Components\n\nTo add new shadcn/ui components:\n\n```bash\nnpx shadcn@latest add [component-name]\n```\n\n### Building for Production\n\n```bash\nnpm run build\n```\n\n### Running Tests\n\n```bash\nnpm run test\n```\n\n## Docker (not implemented)\n\nThe frontend is containerized and can be run with Docker:\n\n```bash\n# Build the image\ndocker build -t frontend-nextjs .\n\n# Run the container\ndocker run -p 3000:3000 frontend-nextjs\n```\n\nOr use the provided Docker Compose setup from the project root.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnemanjam%2Ftiangolo-starter-nextjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnemanjam%2Ftiangolo-starter-nextjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnemanjam%2Ftiangolo-starter-nextjs/lists"}