{"id":16325931,"url":"https://github.com/siegfriedbz/nextjs-wild-oasis","last_synced_at":"2025-04-09T13:31:35.634Z","repository":{"id":243469523,"uuid":"812515391","full_name":"SiegfriedBz/Nextjs-Wild-Oasis","owner":"SiegfriedBz","description":"🌿 Next.js 14 app enabling users to book cabins, featuring responsive design, optimistic UI, Google sign-up, Stripe payments and refund options.","archived":false,"fork":false,"pushed_at":"2024-07-05T12:12:45.000Z","size":9110,"stargazers_count":8,"open_issues_count":0,"forks_count":2,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-03-24T06:12:22.105Z","etag":null,"topics":["app-router","framer-motion","next-auth","nextjs","optimistic-ui","react-hook-form","react-select","responsive-design","stripe-api","supabase","tailwind-css","typescript","zod"],"latest_commit_sha":null,"homepage":"https://next-wild-oasis.vercel.app/","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/SiegfriedBz.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":"2024-06-09T05:41:41.000Z","updated_at":"2024-12-31T00:05:50.000Z","dependencies_parsed_at":"2024-06-09T07:31:35.830Z","dependency_job_id":"4ecd10ee-47f4-4070-bda4-6a7b85a43a7a","html_url":"https://github.com/SiegfriedBz/Nextjs-Wild-Oasis","commit_stats":null,"previous_names":["siegfriedbz/next-wild-oasis","siegfriedbz/nextjs-wild-oasis"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SiegfriedBz%2FNextjs-Wild-Oasis","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SiegfriedBz%2FNextjs-Wild-Oasis/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SiegfriedBz%2FNextjs-Wild-Oasis/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SiegfriedBz%2FNextjs-Wild-Oasis/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SiegfriedBz","download_url":"https://codeload.github.com/SiegfriedBz/Nextjs-Wild-Oasis/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248049254,"owners_count":21039190,"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":["app-router","framer-motion","next-auth","nextjs","optimistic-ui","react-hook-form","react-select","responsive-design","stripe-api","supabase","tailwind-css","typescript","zod"],"created_at":"2024-10-10T23:07:01.897Z","updated_at":"2025-04-09T13:31:34.954Z","avatar_url":"https://github.com/SiegfriedBz.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Wild Oasis\n\nNext.js 14 application with App Router and Server Actions allowing users to book cabins at the Wild Oasis hotel.  \nUsers can navigate different cabins, sign up with Google and create an account.  \nLogged-in users can securely book cabins using Stripe for payment.  \nUsers can also get a refund if the conditions are met.  \nResponsive-design, Tailwind.css.  \nOptimistic UI.\n\n## Table of Contents\n- [Prerequisites](#prerequisites)\n- [Installation](#installation)\n- [Running the Development Server](#running-the-development-server)\n- [Building for Production](#building-for-production)\n- [Running the Production Server](#running-the-production-server)\n- [Technologies Used](#technologies-used)\n- [Stripe Webhook](#stripe-webhook)\n- [Live Demo](#live-demo) 🚀\n\n# Prerequisites\n- Google Cloud Account: Required to set up Next-auth Google Provider\n- Supabase Account: Required for database functionalities.\n- Stripe Account: Required for payment processing functionalities.\n\n# Installation\nInstallation\n\n1. Clone the repository:\n```bash\ngit clone git@github.com:SiegfriedBz/next-wild-oasis.git\ncd next-wild-oasis\n```\n\n2. Install dependencies:\n```bash\nnpm install\n```\n\n3. Set up environment variables:\n\nCreate a .env file in the root directory and add the following environment variables\n\n    NEXT_PUBLIC_URL=\n    CORS_ALLOWED_ORIGIN=\n    \n    # opengraph image\n    NEXT_PUBLIC_OG_IMAGE_URL=\"your-opengrap-1200x600-image\"\n    \n    # Supabase\n    SUPABASE_URL=\n    SUPABASE_API_KEY=\n    \n    # Next Auth \u0026 Google Provider\n    NEXTAUTH_URL=\n    NEXTAUTH_SECRET=\n    GOOGLE_CLIENT_ID=\n    GOOGLE_CLIENT_SECRET=\n    \n    # Stripe keys\n    NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=\n    STRIPE_SECRET_KEY=\n    STRIPE_WEBHOOK_SECRET=\n    \n\n# Running the Development Server\nTo start the development server, run:\n\n```bash\nnpm run dev\n  ```\n\n# Building for Production\nTo build the project for production, run:\n\n```bash\nnpm run build\n```\n\n# Running the Production Server\nAfter building the project, you can start the production server with:\n\n```bash\nnpm start\n```\n\n# Technologies Used\n\n## Frontend:\n- **Framework**: React, Next.js 14 (App Router)\n- **React Hook Form**, **Zod** (for client-side validation)\n- **React Select** (for forms customization)\n- **Styling**: Tailwind CSS, responsive design\n\n## Backend:\n- **DB**: SupaBase\n- **Authentication**: NextAuth.js with Google Provider\n\n## Payment Processing \u0026 Payment Refund:\n- **Stripe**\n\n# Stripe Webhook\nNote - when a user initiates a payment, a non-confirmed booking is created in the database.\nConfigure the Stripe webhook to listen for `checkout.session.completed` events. \nAfter checkout, the webhook will update the corresponding booking:\n- Set `is_paid` to true.\n- Set `stripe_intent_id` to the value retrieved from the Stripe event.\nThe `stripe_intent_id` will allow Stripe to retrieve a payment and to proceed to refund on user's request.\n\n## Live Demo\nVisit the live demo of [The Wild Oasis](https://next-wild-oasis.vercel.app/) deployed on Vercel.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsiegfriedbz%2Fnextjs-wild-oasis","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsiegfriedbz%2Fnextjs-wild-oasis","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsiegfriedbz%2Fnextjs-wild-oasis/lists"}