Pixboard is an application that uses Cloudinary's capabilities to enhance your images in different ways. Thanks to realtime features, you'll be able to collaborate with others users.
- Client Framework: Next.js
- Design capabilities and API for images: Cloudinary
- Realtime: Liveblocks.io
- Authentication: NextAuth
- Deployment: Netlify
- Sign up on Cloudinary.
- Go to console option.
- Then, go to Dashboard and you'll be able to find your
Cloud Name
,API Key
, andAPI Secret
- Copy and paste them into
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
,CLOUDINARY_API_KEY
,CLOUDINARY_API_SECRET
andCLOUDINARY_NAME
. - After that, go to Media Library in the sidebar and press Folders.
- Press on Create a Folder, then fill up
CLOUDINARY_FOLDER_IMAGES
with your folder's name. Here is where your images are going to store.
- Go to Create new Github OAuth app.
- Then go to Client secrets and generate a new one. Then, paste it into
GITHUB_CLIENT_SECRET
. - Finally, copy the Client ID and paste it into
GITHUB_CLIENT_ID
.
You can find ways to generate your API here.
Once you get it, paste it into NEXTAUTH_SECRET
.
- Go to Liveblocks.
- Create a project, then go to API Keys in the sidebar and copy your secret key.
- Finally, paste it into
LIVEBLOCKS_SECRET
.
- Clone this repo to a directory and then run
npm install
. - Set-up your environment variables.
- Run
npm run dev
to start developing mode.