Membuat Aplikasi Chat Sederhana Node JS Part 2

08/07/2017    Ekky Ridyanto    3013    Website

Dibagian kedua ini kita akan mulai menginstal atau menyiapkan package-package apa saja yang akan kita butuhkan. Yang pertama kita buat folder projectnya dengan nama express-io. Buka terminalnya lalu pindah ke folder tempat menyimpan project Node JSnya. Selanjutnya ada dua cara kita bisa langsung menulis dengan membuat file package.json atau juga kita bisa melalui terminal atau comand line dengan mengetikkan npm init sebagai berikut

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-1

Jadi teman teman bisa masukkan name, description dari projectnya hanya dengan menekan enter dibagian terminalnya. Jika berhasil maka secara otomatis kita dibuatkan sebuah file package.json sebagai konfigurasi project Node JS. Langkah berikutnya kita akan memerlukan dependency library yaitu teman teman install express dengan cara ketik npm install ---save express dan module socket-io seperti berikut

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-2

Lalu tekan enter dan bila tidak ada error maka secara otomatis kita akan dibuatkan folder node_modules yang berisi module-module yang kita butuhkan untuk membuat aplikasi chat sederhana.

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-3

Lalu dibagian package.jsonnya tertulis dependencies yang kita akan gunakan

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-4

Oke sejauh ini kita berhasil menginstall dependenciesnya. Setelah itu kita akan buat file statis untuk struktur webnya yang saya tempatkan didalam folder public/index.html lalu kita akan generate struktur HTMLnya biasa tentu untuk designnya saya gunakan Framework Bootstrap dengan sedikit style custom CSS

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-5

File bootstrapnya di simpan didalam folder yang sama yaitu folder public. Hasil response pesan chatnya akan kita tampilkan didalam satu tag <div> dengan id output lalu akan ada input message chatnya, input untuk nama usernya dan satu tag button untuk mengirimnya. Tentu masing masing elemennya akan kita berikan id yang berbeda beda.

Cara-Membuat-AplikasiChat-SederhanaNode-JS-Part2-09-07-2017-6

Itu dia untuk artikel kali ini. Kita sudah berhasil menginstall package package seperti express dan socket-ionya dan kita juga sudah membuat file statis untuk struktur Web Chatnya. Terima kasih.

Artikel, Web Design, Javascript, website

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More
chatarrow