Welcome to Cacta 👋

Cacta is deployed and live, click here to join Cacta now!

Cacta is a social media platform for creating, sharing and discovering short videos

Features:

• Modern & responsive design : Cacta comes with beautiful modern design with fully responsive layout which results in an amazing UX
• Google Authentication : Login with your existing Google accounts with just one click
• Upload videos : Upload and share videos among your friends and peers in an instant
• Like & comments : Once you login, you can like, comment and engage with videos uploaded on Cacta
• User profiles : All users will have their own profile page where uploaded videos and likes will be displayed
• Search : Search existing accounts or videos with advanced search functionality on Cacta
• Suggested accounts : Cacta will suggest you accounts on the side bar from time to time
• Topics tags : Cacta comes with topic tags which can be used to filter videos by topic

Tech. stack

Front-end stack

• Next.js
• React.js
• Tailwind CSS
• Typescript

Back-end stack

• Next.js : API endpoints and serverside rendering
• Google Identity Services SDK : Google authentication with React
• Zustand : State management
• Sanity : Datastore / Headless CMS

Installing locally

Setting up Sanity datastore

• Create a Sanity project with schema provided in ./cacta-backend
• Check out Sanity documentation for a step by step guide
• Once you have your Sanity datastore ready, fill in your env. varilables and proceed with the next steps

Obtaining Google OAuth 2.0 client credentials

• Create a new project on Google API Console to get OAuth 2.0 client credentials
• Following the detailed instructions here to get the crendentials

Setting up dev. environment variables

• Create a new file .env.development under ./ and fill the following three variables

NEXT_PUBLIC_SANITY_TOKEN = < YOUR SANITY PUBLIC TOKEN >

NEXT_PUBLIC_GOOGLE_API_TOKEN = < YOUR GOOGLE AUTH PUBLIC TOKEN >

NEXT_PUBLIC_BASE_URL = http://localhost:3000

Installing dependencies

• Use the following command in your terminal from ./ to install project dependencies

npm install
< or >
yarn install
< or >
pnpm install

Starting the development server

• After you have installed dependencies, use the following command in your terminal from ./ to start the dev. server

npm run dev
< or >
yarn dev
< or >
pnpm dev

• Visit http://localhost:3000 to view Cacta on your local machine

Build & Deploy

Environment variables

• Update the evniornment variables on your hosting platform before building
• NEXT_PUBLIC_BASE_URL can be left empty initially and can be updated once the app is hosted

NEXT_PUBLIC_SANITY_TOKEN = < YOUR SANITY PUBLIC TOKEN >

NEXT_PUBLIC_GOOGLE_API_TOKEN = < YOUR GOOGLE AUTH PUBLIC TOKEN >

NEXT_PUBLIC_BASE_URL = < Hosted URL >

Build command

• Use the following commands for building and deploying

npm run build
< or >
next build

Install command

npm install
< or >
yarn install
< or >
pnpm install

• Congratulations your Cacta app is up and running!

Author

👤 Abdul Ahad Siddiqui

• Github: @AbdulAhadSiddiqui11
• LinkedIn: @abdulahadsiddiqui11

🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2023 Abdul Ahad Siddiqui.
This project is MIT licensed.