magician ai

---

Memperkenalkan Magician AI, platform sangat interaktif yang memanfaatkan kekuatan GPT-3.5 OpenAI untuk pembuatan teks dan DALL-E untuk pembuatan gambar. Serta Replikasi AI untuk pembuatan lagu dan video. Dengan platform kami, Anda dapat berkomunikasi dengan AI, memintanya menulis kode, mendeskripsikan gambar atau video yang akan dibuat, dan banyak lagi. Antarmuka kami ramah pengguna dan dirancang untuk memberikan pengalaman yang menarik dan kreatif. Dibuat untuk menangani langganan dan pembayaran menggunakan Stripe, pengguna mendapatkan penggunaan awal yang terbatas dan selanjutnya dapat berlangganan untuk akses lanjutan.

Persyaratan

Untuk menjalankan proyek, Anda memerlukan:

• Node 18 LTS

• Berikutnya.JS 13+

Fitur

Platform kami menawarkan beberapa fitur unik dan menarik untuk dijelajahi:

Otentikasi dan Manajemen Akun

Sistem kami memastikan pengalaman pengguna yang lancar dan aman:

• Pengguna dapat mendaftar menggunakan email dan kata sandi

• Pengguna dapat mendaftar menggunakan penyedia otentikasi pihak ketiga seperti Google dan GitHub

• Pengguna dapat login menggunakan email dan kata sandi

• Pengguna dapat keluar

• Pengguna dapat mengelola langganan dan pembayaran mereka

Percakapan

Pengguna dapat memperkaya percakapan dengan AI:

• Minta AI untuk menghasilkan teks berdasarkan perintah yang diberikan

• Diskusikan berbagai topik secara percakapan dengan AI

Pembuatan Kode

Pengguna dapat memanfaatkan AI untuk pemrograman:

• Minta AI untuk menulis kode berdasarkan persyaratan tertentu

• AI memberikan cuplikan kode yang dihasilkan beserta penjelasannya

Pembuatan Gambar

AI membuat gambar dari deskripsi pengguna:

• Pengguna mendeskripsikan suatu gambar

• AI menghasilkan sejumlah gambar yang cocok dengan deskripsi tersebut pada resolusi tertentu

Pembuatan Video

Rasakan kreativitas AI dengan pembuatan video:

• Pengguna mendeskripsikan sebuah video

• AI menghasilkan video berdasarkan deskripsi yang diberikan

Harap dicatat bahwa setelah penggunaan dalam jumlah terbatas, pengguna harus berlangganan untuk terus mengakses fitur-fitur ini. Manajemen pembayaran dan langganan ditangani dengan aman menggunakan Stripe.

Tumpukan Teknologi

Proyek Magician AI memanfaatkan serangkaian teknologi modern yang tangguh untuk menghadirkan pengalaman pengguna berkualitas tinggi:

Bagian depan

• Next.js : Kerangka kerja berbasis React yang menawarkan alat dan konvensi untuk rendering sisi server (SSR) dan aplikasi web yang dihasilkan secara statis.

• Tailwind CSS : Kerangka kerja CSS yang mengutamakan utilitas yang mempromosikan desain yang sangat dapat disesuaikan dan responsif.

• Shadcn UI : Kumpulan komponen yang dapat digunakan kembali, dapat diakses, dan dapat disesuaikan yang dibuat dengan Radix UI dan Tailwind CSS. Shadcn UI menawarkan permulaan yang mudah bagi pengembang, terlepas dari pengalaman mereka dengan pustaka komponen.

Bagian belakang

• Node.js : Lingkungan runtime JavaScript yang mengeksekusi kode JavaScript di luar browser web.

• Prisma : ORM sumber terbuka yang menyediakan klien tipe aman untuk kueri yang efisien dan bebas bug.

• Axios : Klien HTTP berbasis janji yang digunakan untuk membuat permintaan HTTP.

• Clerk Auth : Platform otentikasi dan manajemen pengguna yang mudah digunakan. Clerk menyediakan berbagai strategi otentikasi dan sistem manajemen pengguna yang komprehensif. Aman, terukur, dan mudah digunakan, dengan komponen UI yang dapat disesuaikan.

• Stripe : Platform pemrosesan pembayaran online yang digunakan dalam proyek ini untuk menangani pembayaran dan langganan.

• Zod : Deklarasi skema dan pustaka validasi TypeScript-first yang digunakan untuk REST API yang aman untuk tipe.

• MySQL : Sistem manajemen basis data relasional sumber terbuka yang populer.

AI dan Generasi Media

• OpenAI : Digunakan untuk menghasilkan teks dan gambar. GPT-3.5 OpenAI digunakan untuk pembuatan teks, dan DALL-E untuk pembuatan gambar.

• Replikasi AI : Digunakan untuk menghasilkan musik dan video berdasarkan masukan pengguna.

Setiap teknologi dalam tumpukan ini memainkan peran penting dalam memberikan pengalaman pengguna yang lancar dan dinamis.

Menjalankan Aplikasi Secara Lokal

1. Kloning Proyek Secara Lokal

Buka terminal Anda dan gunakan perintah berikut untuk mengkloning proyek:

 git klon https://github.com/mbeps/magician-ai.git

2. Instal Dependensi

Arahkan ke direktori root proyek dan instal dependensi yang diperlukan menggunakan perintah berikut:

 pemasangan benang

3. Atur Variabel Lingkungan

Buat salinan file .env.example dan ganti namanya menjadi .env.local . Isi .env.local dengan rahasia yang diperlukan.

Berikut petunjuk untuk mendapatkan beberapa rahasia tersebut:

Petugas Auth

1. Buat akun di situs web Panitera.

2. Buat aplikasi baru.

3. Di dasbor aplikasi Anda, buka bagian pengaturan.

4. Anda akan menemukan NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY dan CLERK_SECRET_KEY di bagian ini.

5. Tambahkan kunci ini ke variabel lingkungan Anda di .env.local .

Anda juga perlu menambahkan URL berikut untuk Clerk Auth:

NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/dashboard
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/dashboard

Untuk OPENAI_API_KEY , REPLICATE_API_TOKEN , DATABASE_URL , STRIPE_API_KEY , dan NEXT_PUBLIC_APP_URL , rujuk ke halaman dokumentasi atau pengaturan layanan masing-masing untuk mendapatkan nilai-nilai ini.

4. Menjalankan Basis Data (Docker)

Langkah ini diperlukan jika Anda ingin menggunakan image Docker yang telah disediakan. Anda juga dapat menggunakan layanan cloud alternatif untuk MySQL. Pastikan untuk mengubah string koneksi pada file .env jika Anda ingin melakukannya.

Jalankan perintah berikut dari root proyek untuk memulai container MySQL Anda:

 docker-compose --env-file .env -f docker/docker-compose.yml naik db

5. Siapkan Prisma

Untuk menyiapkan Prisma dan skema push ke database, gunakan perintah berikut:

Hasilkan Klien Prisma:

 benang prisma dihasilkan

Dorong skema Prisma ke database:

 benang prisma db dorong

5. Siapkan Webhook Stripe

Jalankan Stripe CLI dan buat ia mendengarkan webhook:

 stripe mendengarkan --meneruskan-ke localhost:3000/api/webhook

Ini akan menampilkan STRIPE_WEBHOOK_SECRET Anda. Tambahkan ini ke variabel lingkungan Anda di .env.local .

6. Jalankan Proyek

Setelah Anda menyiapkan variabel lingkungan, Prisma, dan Stripe, gunakan perintah berikut untuk menjalankan proyek:

Di satu terminal, jalankan server Next.js:

 pengembang benang

Di terminal lain, mulai pendengar Stripe:

 stripe mendengarkan --meneruskan-ke localhost:3000/api/webhook

Ini harus menjalankan proyek di localhost:3000 .

Catatan: Server frontend Next.js dan Stripe CLI harus berjalan secara bersamaan agar aplikasi dapat berfungsi dengan baik.