Menyimpan Data dengan Mudah
Daripada storan setempat kepada pangkalan data sebenar.
Menyimpan Data dengan Mudah ialah pelajaran Pengekodan Vibe percuma di CoddyKit. Ini ialah pelajaran 3 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Pengekodan Vibe, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Pengekodan Vibe merangkumi sejumlah 4 pelajaran.
Data yang Kekal
Kebanyakan aplikasi perlu mengingati perkara tertentu: senarai tugasan anda, nota yang disimpan dan tetapan mod gelap yang dipilih. Tanpa storan, semuanya hilang apabila anda memuat semula halaman.
Berita baiknya, anda boleh beralih daripada 'tidak mengingati apa-apa' kepada 'mengingati segala-galanya' hanya dengan menerangkan perkara yang perlu disimpan — AI akan mengendalikan kod storan.
Tangga Storan
Terdapat beberapa tahap storan, daripada yang paling ringkas hingga yang paling berkuasa. Mulakan dengan tahap rendah dan naik hanya apabila diperlukan:
- Dalam memori — pantas tetapi terlupa apabila dimuat semula
- Storan setempat — disimpan dalam pelayar pengguna dan kekal selepas dimuat semula
- Pangkalan data — dikongsi merentas peranti dan pengguna, pilihan sebenar
Memberitahu AI anak tangga yang dikehendaki membantu memastikan aplikasi anda sesederhana mungkin.
Menyimpan dalam Pelayar
Storan berterusan yang paling mudah ialah localStorage — seperti buku nota kecil yang disimpan oleh pelayar untuk aplikasi anda. Ia sesuai untuk tetapan dan senarai kecil pada satu peranti.
Anda tidak memerlukan pelayan atau akaun untuk ini. Arahan seperti contoh di bawah boleh menambahkannya serta-merta.
Make my to-do list save to the browser's
localStorage so my tasks are still there after I
refresh the page. Load them automatically when the
page opens.Cara localStorage Berfungsi
localStorage menyimpan teks menggunakan nama (sebuah 'kunci'). Untuk menyimpan objek atau senarai, anda menukarkannya kepada teks JSON dahulu, kemudian menukarkannya kembali semasa membaca.
Jalankan ini untuk melihat corak yang digunakan oleh AI: simpan satu nilai, kemudian baca semula nilai itu.
const settings = { theme: 'dark', fontSize: 16 };
const saved = JSON.stringify(settings);
console.log('Saved text:', saved);
const loaded = JSON.parse(saved);
console.log('Theme is:', loaded.theme);Apabila localStorage Tidak Mencukupi
localStorage hanya wujud dalam satu pelayar pada satu peranti. Jika anda mahu pengguna melihat data mereka pada telefon dan komputer riba, atau berkongsi data antara pengguna, anda memerlukan pangkalan data pada pelayan.
Kedengarannya menakutkan, tetapi alat menjadikannya mudah. Anda hanya perlu menerangkan perkara yang hendak disimpan dan AI menyediakan panggilan kepada pangkalan data.
Pangkalan Data Mudah untuk Pembangun Berasaskan AI
Anda tidak perlu mengurus pelayan sendiri. Pangkalan data terhos memberikan anda storan dengan hampir tiada persediaan:
- Supabase — pangkalan data mesra pengguna dengan log masuk terbina dalam, amat sesuai dengan alat AI
- Firebase — pangkalan data masa nyata milik Google
- Airtable — hamparan yang berfungsi seperti pangkalan data
Pembina seperti Bolt, Lovable dan Replit boleh menyambungkan perkhidmatan ini untuk anda apabila diminta.
Menambah Pangkalan Data melalui Arahan
Untuk menambah storan sebenar, terangkan perkara yang hendak disimpan dan tempat penyimpanannya. Menamakan Supabase (pilihan yang popular) memberitahu AI persediaan tepat yang perlu dijana.
Arahan ini menukar aplikasi yang hanya berfungsi secara setempat menjadi aplikasi dengan pangkalan data yang dikongsi dan berterusan.
Connect this app to Supabase. Create a table called
notes with columns: id, title, content, and
created_at. Update the app so saving a note inserts
a row, and the homepage loads all notes from the
table, newest first.Berfikir dalam Bentuk Jadual
Pangkalan data menyimpan data dalam jadual — seperti hamparan dengan lajur bernama. Jadual 'nota' mungkin mempunyai tajuk, kandungan dan tarikh. Setiap nota yang disimpan ialah satu baris.
Anda tidak perlu menguasai reka bentuk pangkalan data. Beritahu sahaja AI medan yang dimiliki oleh setiap perkara dan AI akan membina jadual untuk anda.
Mencipta, Membaca, Mengemas Kini, Memadam
Hampir setiap aplikasi data melakukan empat perkara, yang secara ringkasnya dipanggil CRUD: mencipta item baharu, membacanya semula, mengemas kininya dan memadamnya. Jika aplikasi anda boleh melakukan keempat-empatnya, ia ialah alat yang sebenar.
Anda boleh meminta AI menambahnya satu demi satu dan menguji setiap ciri sebelum meneruskan.
Add full editing to my notes app: I should be able
to create a note, edit an existing note's title and
content, and delete a note with a confirm dialog.
Keep everything saved to Supabase.Mulakan dengan Ringkas, Naik Taraf Kemudian
Langkah bijak ialah bermula pada anak tangga terendah yang sudah berfungsi. Membina prototaip pantas? Gunakan localStorage. Perlu menggunakannya pada setiap peranti? Naik taraf kepada pangkalan data. AI juga boleh memindahkan data anda — 'tukar aplikasi saya daripada localStorage kepada Supabase.'
Jangan bina sistem yang terlalu rumit pada peringkat awal. Padankan storan dengan keperluan sebenar aplikasi anda hari ini.
My app currently uses localStorage. Migrate it to
use Supabase instead so my data syncs across
devices, and move any existing local data into the
database on first load.Sandaran dan Mengelakkan Kehilangan Data
Data amat berharga — pengguna akan kecewa jika data itu hilang. Pangkalan data terhos seperti Supabase dan Firebase menyimpan sandaran untuk anda, yang merupakan satu lagi sebab untuk beralih daripada localStorage bagi perkara yang penting.
Anda juga boleh membenarkan pengguna mengeksport data mereka sendiri sebagai langkah keselamatan. Minta AI menambah sandaran dengan satu klik supaya tiada sesiapa kehilangan hasil kerja mereka.
Add a "Download backup" button that exports all my
notes from the database as a JSON file, and an
"Import backup" option that restores them. This
way users never lose their data.Semakan Pantas
Anda membina aplikasi nota yang menggunakan localStorage pelayar. Seorang pengguna mengadu bahawa mereka tidak dapat melihat nota apabila membuka aplikasi pada telefon. Apakah jenis storan yang sebenarnya diperlukan?
Imbas Kembali: Menyimpan Data dengan Mudah
Anda telah mempelajari tangga storan: bermula dengan memori, kemudian localStorage untuk kegigihan pada satu peranti, dan akhirnya pangkalan data sebenar untuk data yang dikongsi merentas peranti.
Anda telah melihat cara menyimpan tetapan dalam pelayar, masa untuk menaik taraf kepada pangkalan data terhos seperti Supabase, cara data disimpan dalam jadual, serta tindakan CRUD yang diperlukan oleh setiap aplikasi data. Mulakan dengan ringkas dan biarkan AI menaik tarafnya untuk anda. Seterusnya: memastikan kunci API dan rahsia anda selamat.
Pelajari JavaScript dengan tutor kecerdasan buatan — percuma
Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.
- Kursus
- 25
- Pelajaran
- 100
Soalan Lazim
Adakah pelajaran “Menyimpan Data dengan Mudah” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Pengekodan Vibe, termasuk “Menyimpan Data dengan Mudah”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Pengekodan Vibe merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Menyimpan Data dengan Mudah”?
Daripada storan setempat kepada pangkalan data sebenar. Anda berlatih Pengekodan Vibe menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.
Adakah saya memerlukan pengalaman untuk memulakan Pengekodan Vibe?
Tiada pengalaman terdahulu diperlukan. Pembelajaran Pengekodan Vibe di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 3 daripada 4.
Berapa lamakah pelajaran “Menyimpan Data dengan Mudah” diambil?
Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.
Bolehkah saya menulis dan menjalankan kod dalam pelajaran Pengekodan Vibe ini?
Ya. Setiap pelajaran Pengekodan Vibe menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.
Semua pelajaran dalam kursus ini
- Berbual dengan API
- Membaca dan Menyimpan Fail
- Menyimpan Data dengan Mudah
- Mengendalikan Rahsia dan Kunci