Alright, what's up guys? Ini lagi pada rame banget ya, ngebahas tentang DeepSeek dan gue mau ikutan. Oke, gue mau ngebahas gimana sih caranya kita bisa ngedownload DeepSeek ini.
Abis itu kita install ke dalam komputer kita, terus nanti kita bisa berkomunikasi dengan AI model ini lewat sebuah web interface ini gue build pake React. Ya, sesuai dengan judul video ini ya gitu. Oke, gak usah bahas-bahas sih, gue mau straight to the point aja.
Pertama-tama, kalian harus ke sini, olama.com. Oke, buka olama.com dan kalian harus download ini. Supaya kalian bisa nge-install LLM-nya Atau si Deepseek-nya ini ke dalam komputer kalian Kayaknya tinggal klik download Nanti bakal dipilih gitu kan Mau pake OS apa Gue pake Windows Tinggal download aja for Windows Abis itu kalian tinggal execute ininya Apa namanya, downloadernya Abis itu yaudah gak ada yang perlu diklik-klik lagi Kayak gitu, oke Jadi gue akan skip part itu Silahkan download dulu olama Oke, abis itu teman-teman Kalian nanti di bagian search model ini, kalian nanti cari aja DeepSeek gitu DeepSeek R1 Oke, nanti paling kan semua linknya gue bakal taruh di description juga Oke, abis itu disini teman-teman Kalian bisa pilih parameter Mau pilih jumlah parameter yang mana Kayak gitu, ada yang dari 1,5 miliar sampai 671 miliar gitu Nah ini tergantung hardware kalian Segacor apa, sejago, sekuat apa Itu bisa ngejalanin, apa namanya, mau model yang mana Kayak gitu Nah untuk Educational purposes, ini supaya kita Yang penting jadi aja dulu Kalian bisa pilih yang 1,5 billion parameter aja dulu Supaya ya nggak terlalu ngeberatin sistem Nanti perlahan-lahan kalau misalnya kalian ngerasa Oh PC gue cukup kuat nih Yaudah naikin, naikin, naikin, naikin Nah sekarang Kalau ini udah kalian pilih Harusnya di sebelah kanan sini ada komennya ya Ini tinggal kalian copy Terus kalau olamanya udah selesai tinggal kalian paste di terminal oke ini gue akan buka terminal oke terminal polosan doang ini gue paste olama run deepseek r1.2 nih liat ya ini parameternya kita pake yang 1,5 billion aja kalau kalian klik enter ketik enter gitu nanti harusnya kalian nge-pull dulu nge-download gitu baru muncul kayak ginian nah ini kalau gue langsung muncul sign a message gini karena gue udah Download sebelumnya, sebelum tutorial ini Nah sekarang disini kalian bisa chattingan Kayak, hello deepseek Nanti dia bakal mikir Karena dia reasoning model, terus dia ngasih outputnya Nah cuman kan kentang ya, gak asik Kalau misalnya kita ngeliatnya di terminal doang Nah sekarang gue ajarin gimana caranya kalian bisa Akses deepseek model ini Lewat web interface Supaya lebih enak aja diliat Gue disini Sebenernya udah bikin sebuah React App baru UI-nya doang, oke?
Dan gue nggak mau wasting time kalian. Jadi, ini gue kasih tunjuk semua UI code-nya, sampai state management-nya, sampai buat input-inputannya, karena nanti ini nggak penting. Kayaknya gue asumsi kalian kalau udah nonton video ini harusnya udah ngerti tentang React. Nanti gue ngebahas di bagian cara berkomunikasi dengan modalnya aja.
Jadi ini gue kasih waktu untuk kalian coba. Silahkan pause-pause videonya gitu, kita akan copy-paste. Oke, gue cuma ganti-ganti di app.tsx-nya Sama disini gue bikin satu komponen namanya message card Kayak gitu Iya disini gue pake TypeScript Kalo kalian mau pake JavaScript tinggal diapus aja type-nya Gak usah pake types-nya Oke?
Oke, silahkan, silahkan di copy dulu Abis itu Oh iya, by the way ini gue pake Tailwind ya Jadi kalian harus sedikit nge-configure si Tailwind-nya Jadi, apa namanya Ya, cuma gue gak akan bahas itu Kalian harusnya coba bisa cari tutorial lain ya untuk itu Nah Anyways, sekarang, kalau misalkan code kalian udah jadi, harusnya bentuknya udah seperti ini. Gue by default gue kasih sebuah message, hello, how can I assist you today? Nah, kayak gitu. Abis itu nanti asumsinya kita bisa ngetik-ngetik, nanti disimpan di state ini. Abis itu pas kita submit, dia bakal muncul message, kayak misalnya kita test, bakal muncul message, terus nanti bakal dibales lagi sama si modelnya, kayak gitu.
Cuma gua mau warning dulu dari sekarang, ini kalau kita refresh dia masih hilang ya. Oke, kita belum ngebahas nanti tentang gimana caranya kita bisa bikin folder di kiri gitu. Abis itu kita bikin semuanya kesimpen message-nya, itu kita belum sampai situ.
Oke, kalau kalian tertarik ya silahkan komen nanti kita... gua akan consider untuk bahas bikin project seperti itu. Nah, anyways, sekarang kita tinggal bikin function di sini, di bagian handle submit-nya.
Ketika kita kirim sebuah message, kita mau dibalas sama si AI modelnya, si deep seek-nya. Nah, caranya adalah kita bisa menggunakan sebuah library. Ini gue udah install sebenarnya. Di package.json gue kasih tunjuk ada olama. Jadi olama itu nyediain sebuah npm package juga.
Ini tinggal kalian di terminal aja kalian ketik npm install olama Kayak gitu Ini npm package supaya kalian bisa berkomunikasi dengan olama Supaya kalian bisa berkomunikasi dengan AI si deepseek nya itu sendiri Yang ada di komputer kalian, oke Jadi data kalian gak akan kemana-mana, bener-bener lokal Oke, kalau kalian udah install Ini gue coba install lagi deh Oke, harusnya muncul kayak gini, udah aman Di package.json nya juga udah ada dependencies olama kayak gini Tinggal kita tutup, sekarang kita mulai coding. Ini gue npm run dev supaya jalan lagi. Oke.
Nah sekarang gue mau bikin di bagian sini functionnya. Function AI misalkan. Oke.
Ketika gue klik button send-nya tadi, klik button send ini, dia kan bakal nge-submit ya, nge-submit form-nya. Kalau kita lihat form-nya, dia on submit, dia nge-panggil si handle submit, which is function ini kan. Oke. Nah, setelah dia nge-set messagenya, oke, message kita muncul, sep, kita mau panggil si deep seek AI kita yang ada di dalam komputer lewat olama. Abis itu, kita tampilin.
Kita tampilin di web interface-nya. Nah, caranya, teman-teman, di sini kita tinggal panggil gini. Kita bikin variable aja, response namanya. Kita await, oke. Kita panggil si olama.
Jadi, kita import dulu. Import olama from... Await olama.chat Jadi dia udah ada method namanya.chat Untuk kita berbicara dengan si modelnya Nah disini dia minta sebuah objek Kita diminta untuk ngasih modelnya apa Modelnya bisa kita dapetin dari yang tadi nih Dipsik R1 Ini kita copy bagian sini aja nih Gue akan zoom deh ya biar keliatan deepseek-r1.1.5b Kayak gitu.
Oke. Jadi disini gue paste modelnya. Abis itu kita kasih messages. Kayak gitu.
Oke. Nah kalau kalian lihat disini teman-teman ya. Oke.
Dia minta type-nya itu message array. Jadi disini kita kasih array. Terus kalau kalian mau lihat bentuk message-nya kayak gimana kita tinggal kasih kurung-kurung awal ini untuk objeknya. Lihat nih. Tampilannya ada gini, ada kontennya, itu biasanya message-nya kita, ada role-nya, ini role yang ngasih message-nya siapa, bisa asistennya, bisa usernya, kayak gitu.
Bisa sampai ngasih image gitu. Habis itu sama ada tool call, ini jujur gue nggak tahu ini apaan. Tapi yang paling penting kita akan kasih adalah konten sama role-nya. Kayak gitu.
Role-nya, udah pasti, asisten, asisten, kayak gini. Sorry, role-nya adalah user. Lalu, kontennya adalah input-an kita. Oke, input. Ini state kita nih.
Input. Nah, sebenarnya di sini gue lupa, gue udah bikin variable-nya di sini. Oke, jadi di sini tekniknya kita nggak perlu bikin objek lagi.
Tinggal kita kasih variable new message aja. Sama aja, sama persis kan. Ada role user, ada konten, input. Kayak gitu.
Tapi inget bahwa di sini messages kita kirimnya sebuah array ya. Oke, array memang cuma satu doang itemnya. Cuma satu index doang Oke Kalau udah Disini kalian ada option Sebenarnya untuk Mau responsenya itu dibatch Habis itu langsung dikirim semuanya Ketika udah selesai Atau kita stream Gitu Jadi ya kayak streaming video gitu ya Jadi cuma per part gitu dikirimnya Oke Untuk tutorial kali ini Supaya mempermudah aja Ini supaya nunjukin ke kalian doang Capability dari si DeepSick dan Olama Ini streamnya Gue gak akan kasih true Oke, kita false aja.
Oke, jadi kita nunggu semua responsnya udah kekumpul, baru kita tampilin di web UI kita. Alright, nah sekarang, kita bisa ngakses object response.message namanya. Nah, message ini ada lagi. Oke, content sama role.
Sama persis kayak yang kita mau kirim di sini tadinya. Oke, nanti kita mau ambil si role-nya untuk ngasih tau ini message-nya dari si... AI-nya dari assistant-nya, sama kita mau ambil kontennya untuk kita tampilin nanti di web UI kita. Kayak gitu. Nah, untuk mempermudah respons-nya ini, kita destructure aja, kita kasih message seperti ini.
Nah, sekarang kita tinggal panggil set messages, prep messages kayak gini. Oke, karena kita mau ambil value yang lama, kita spread messages yang lama, terus kita kasih sebuah objek baru. Nah, objeknya...
Role nya kita langsung hardcode aja, assistant, kayak gini Karena yang penting kita mau ambil sebenarnya adalah si konten nya Jadi kita kasih koma sekarang Content isinya adalah message, variable yang diatas ini, message .content Kayak gitu Oke Abis itu udah Selesai Semudah ini Oke Kalau kita save Sekarang Kita coba ya jalanin ya Ini react appnya Misalnya kita bikin hello world Kita send Oke Langsung muncul Gitu Hello How can I assist you In hello world Kayak gitu Oke Abis itu kalau kalian lihat disini Ada bagian Tag think Gitu Karena dia Sebuah reasoning model Teman-teman Jadi dia kayak bakal mikir dulu sebelum ngasih jawabannya. Nah ini kalau kalian mau hapus ya tinggal kalian bikin script untuk cari stringnya. Abis itu kalian hapus aja bagian string sittingnya ini.
Kalau gue, gue bakal biarin dulu kayak gitu. Dan kalau kalian mau lebih canggih lagi ya silahkan bikin UI untuk bagian thinknya ini doang. Oke, gue cuma nunjukin bare minimum featurenya aja kayak gitu. Tapi sekarang kalau kita kasih message lain misalkan kayak write me a poem.
Puisi tentang programming gitu. About Programming Kita send, nanti dia bakal mikir, ini dia lagi mikir ya Oke, abis itu nanti harusnya dia ngasih kita sebuah response Nah, gitu ya Biasanya kan kalau di chat GPT atau di chat Deepseek itu kan Pas kita ngasih inputnya itu kan langsung muncul tuh, dia kayak lagi nulis, lagi ngetik Nah itu yang bagian streamnya ini teman-teman Oke, kalau streamnya kalian true Nah kalian bisa dapat message-nya itu perbagian Tapi kalau misalnya kalian false Berarti ya dia nunggu sampai selesai dulu, baru dia ngasih kita brek gitu semua. Oke, lihat di sini, dia bakal mikir dulu, dia think, gitu, dia think lagi sampai di bagian sini nih. Oke, nah respons aslinya itu di bagian sini, programmers form.
Tuh, dia tulisin kita sebuah puisi. Oke, udah semudah itu. Cuma sekali lagi gue ingetin, kalau kita refresh di sini, kayak dia bakal hilang.
Oke, kita belum bahas sampai situ. Tapi at least, ya kalian tau. Udah ada capability ini di Website-website jaman sekarang Atau yang kalian bisa lakukan di dalam Komputer kalian saat ini Kita bisa pake olama Untuk jalanin sebuah Model yang kita download Which is si Deepseek ini Dan semua ini teman-teman berjalan Di atas Local machine kalian Jadi disini kalo kalian gak pake internet pun Ini tetep akan berjalan Jadi kalian basically udah punya kayak AI Assistant chat sendiri di komputer kalian secara lokal.
Dan benar-benar datanya, ingat di sini kita nggak ngirim data kemana-mana ya. Karena AI agentnya itu sendiri, AI modelnya itu sendiri ada di dalam komputer kita, yaudah kita ngeprosesnya dalam komputer kita doang. Datanya itu tidak akan pergi kemanapun. Udah deh, selesai.
Simple kan? Itu doang mungkin ya tutorialnya. Nanti kalau kalian tertarik untuk bikin ini jadi lebih kompleks, misalkan kita stream, Oke, chatnya jadi ngetik, abis itu thinknya kita bikin tampilannya lebih oke Kita bikin supaya kalau di refresh itu nggak apa namanya, nggak apus Oke, dia tetap ada di sini, abis itu bikin folder-folder kayak chat GPT gitu lah ya Ya silahkan komen kalau kalian tertarik Tapi basically ini basic functionality dari si olama yang kita komunikasikan dengan si deep sync Oke, semoga kalian suka videonya yang simple ini Oke, semoga berguna untuk kalian ketemu lagi di video berikutnya.
Bye-bye!