https://github.com/coder-blue/zircon-blue
An Imperfect Google Drive Clone
https://github.com/coder-blue/zircon-blue
appwrite-database google-drive-clone nextjs shadcn-ui
Last synced: 6 months ago
JSON representation
An Imperfect Google Drive Clone
- Host: GitHub
- URL: https://github.com/coder-blue/zircon-blue
- Owner: Coder-Blue
- License: mit
- Created: 2024-11-18T15:34:17.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-09T12:09:43.000Z (about 1 year ago)
- Last Synced: 2025-06-04T08:23:42.594Z (8 months ago)
- Topics: appwrite-database, google-drive-clone, nextjs, shadcn-ui
- Language: TypeScript
- Homepage: https://zircon-blue.vercel.app
- Size: 948 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# TL;DR
- This so called **Zircon Blue** is just a simple Google Drive Clone that I made based on [JavaScript Mastery](https://www.youtube.com/@javascriptmastery)'s video, but there is a bit of adjustment just only for _Vietnamese_.
- The live website is in the description. You can try it out, althought I'm only making it for my friends, and my personal research lab.
## What can it do?
- 💽 Working as a imperfect clone of Google Drive.
## Donate
You can support financially with this QR code bank scanning, thank you very much <3:
## Learn More
# Techstack
- React 19
- Next.js 15
- Appwrite
- TailwindCSS
- ShadCN
- TypeScript
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).
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Nunito, a custom Google Font.
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying folders and it's contents. The page auto-updates as you edit the file.
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!
# If you want to build it?
- Config your [Appwrite Database](https://appwrite.io/) like the JavaScript Mastery's Google Drive Clone video.
- Clone the repo:
```bash
git clone https://github.com/Coder-Blue/zircon-blue.git
cd zircon-blue
```
- Install:
```bash
npm install --legacy-peer-dep
```
- Create a file named `.env.local` in the root of your project and add the following content:
```env
NEXT_PUBLIC_APPWRITE_ENDPOINT="https://cloud.appwrite.io/v1"
NEXT_PUBLIC_APPWRITE_PROJECT=""
NEXT_PUBLIC_APPWRITE_DATABASE=""
NEXT_PUBLIC_APPWRITE_USERS_COLLECTION=""
NEXT_PUBLIC_APPWRITE_FILES_COLLECTION=""
NEXT_PUBLIC_APPWRITE_BUCKET=""
NEXT_APPWRITE_KEY=""
```
- Develop the project:
```bash
npm run dev
```
## Support
- You can ask me if there is any problem:
Join my Discord server: https://discord.gg/5Nmwm24dWV
Email contact: trananhquan1009@gmail.com
Facebook contact: [Noah Trần](https://www.facebook.com/noah.tran1109)