Update docs
This commit is contained in:
Brad Traversy
@@ -1,36 +1,91 @@
|
||||
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
|
||||
# Property Pulse
|
||||
|
||||
> A web application to help you find your next rental property.
|
||||
|
||||
This is the main project from my [Next 14 From Scratch Course](https://www.traversymedia.com/nextjs-from-scratch)
|
||||
|
||||
The `_theme_files` folder contains the pure HTML files with Tailwind classes.
|
||||
|
||||
<img src="/public/images/screen.jpg" />
|
||||
|
||||
## Features
|
||||
|
||||
Here are some of the current features that Property Pulse has:
|
||||
|
||||
- [x] User authentication with Google & Next Auth
|
||||
- [x] User authorization
|
||||
- [x] Route protection
|
||||
- [x] User profile with user listings
|
||||
- [x] Property Listing CRUD
|
||||
- [x] Property image upload (Multiple)
|
||||
- [x] Property search
|
||||
- [x] Internal messages with 'unread' notifications
|
||||
- [x] Photoswipe image gallery
|
||||
- [x] Mapbox maps
|
||||
- [x] Toast notifications
|
||||
- [x] Property bookmarking / saved properties
|
||||
- [x] Property sharing to social media
|
||||
- [x] Loading spinners
|
||||
- [x] Responsive design (Tailwind)
|
||||
- [x] Custom 404 page
|
||||
- [x] Next.js Actions
|
||||
|
||||
Property Pulse uses the following technologies:
|
||||
|
||||
- [Next.js](https://nextjs.org/)
|
||||
- [React](https://reactjs.org/)
|
||||
- [Tailwind CSS](https://tailwindcss.com/)
|
||||
- [MongoDB](https://www.mongodb.com/)
|
||||
- [Mongoose](https://mongoosejs.com/)
|
||||
- [NextAuth.js](https://next-auth.js.org/)
|
||||
- [React Icons](https://react-icons.github.io/react-icons/)
|
||||
- [Photoswipe](https://photoswipe.com/)
|
||||
- [Cloudinary](https://cloudinary.com/)
|
||||
- [Mapbox](https://www.mapbox.com/)
|
||||
- [React Map GL](https://visgl.github.io/react-map-gl/)
|
||||
- [React Geocode](https://www.npmjs.com/package/react-geocode)
|
||||
- [React Spinners](https://www.npmjs.com/package/react-spinners)
|
||||
- [React Toastify](https://fkhadra.github.io/react-toastify/)
|
||||
- [React Share](https://www.npmjs.com/package/react-share)
|
||||
|
||||
## Getting Started
|
||||
|
||||
First, run the development server:
|
||||
### Prerequisites
|
||||
|
||||
- Node.js version 18 or higher
|
||||
- MongoDB Atlas account and a cluster. Sign up and create a cluster at [MongoDB](https://www.mongodb.com/)
|
||||
- Cloudinary account. Sign up at [Cloudinary](https://cloudinary.com/)
|
||||
- Google console account. Sign up at [Google Cloud](https://console.cloud.google.com/)
|
||||
- Mapbox account. Sign up at [Mapbox](https://www.mapbox.com/)
|
||||
|
||||
### `.env` File
|
||||
|
||||
Rename the `env.example` file to `.env` and fill in the following environment variables:
|
||||
|
||||
- Get your MongoDB connection string from your MongoDB Atlas cluster and add it to `MONGODB_URI`.
|
||||
- Get your Google client ID and secret from your Google console account and add them to `GOOGLE_CLIENT_ID` and `GOOGLE_CLIENT_SECRET`.
|
||||
- Add a secret to `NEXTAUTH_SECRET`. You can generate with the following command:
|
||||
```bash
|
||||
openssl rand -base64 32
|
||||
```
|
||||
- Get your Cloudinary cloud name, API key, and API secret from your Cloudinary account and add them to `CLOUDINARY_CLOUD_NAME`, `CLOUDINARY_API_KEY`, and `CLOUDINARY_API_SECRET`.
|
||||
- Get your Mapbox token from your Mapbox account and add it to `NEXT_PUBLIC_MAPBOX_TOKEN`.
|
||||
- Get your Google Geocoding API key from your Google console account and add it to `NEXT_PUBLIC_GOOGLE_GEOCODING_API_KEY`.
|
||||
|
||||
### Install Dependencies
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
### Run the Development Server
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
# or
|
||||
pnpm dev
|
||||
# or
|
||||
bun dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.
|
||||
## License
|
||||
|
||||
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
|
||||
|
||||
## Learn More
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
|
||||
|
||||
## Deploy on Vercel
|
||||
|
||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
||||
|
||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
|
||||
This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details
|
||||
|
||||
Reference in New Issue
Block a user