Navigation

    BaliJS
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Popular
    • Talents
    • Users
    • Groups
    1. Home
    2. alfrcr
    3. Posts

    I Putu Alfred Crosby (@alfrcr)

    99
    Reputation
    130
    Posts
    68
    Profile views
    19
    Followers
    96
    Following
    • Profile
    • Following
    • Followers
    • Topics
    • Posts
    • Best
    • Groups

    Information about I Putu Alfred Crosby

    Angular Dev ReactJS Dev VueJS Dev Problem Solver JS Warrior BaliJS Organizer
    Joined
    Last Online
    Location
    Jakarta Selatan
    Age
    31

    About me

    Data Warehouse Engineer at Gopay. Formerly SWE at Kumparan, Grab, Tokopedia, Urbanhire.

    Posts made by alfrcr

    • Bacaan Buku Wajib Programmer

      Non teknis aku pernah baca The Effective Engineer, mayan bagus jg.
      Nunggu dari sumber referensi @wayanjimmy wkwkkw

      posted in Diskusi Umum
    • Tombol reaction pada thread/topic (UX yang lebih baik)

      Sementara tombol reaksi nya aku buat kaya gitu ya fin.
      Kalo udah cukup mohon berkenan thread nya dikasi tanda closed ya šŸ™

      posted in Komentar dan Masukan
    • Sharing Spotify playlist-mu untuk nemenin kamu kerja/belajar

      @teofiluscandra nostalgia bgt ya wkwk, kadang aku masih dengerin wali band sama st12 jg 🤣

      posted in Diskusi Umum
    • Sharing Spotify playlist-mu untuk nemenin kamu kerja/belajar

      @4tnuts anone? 🤣🤣

      posted in Diskusi Umum
    • Sharing Spotify playlist-mu untuk nemenin kamu kerja/belajar

      Yg wibu kita buat thread khusus aja lah nanti yuk atau buat grup khusus wkwkwkkw 🤣

      posted in Diskusi Umum
    • Live Streaming: Analisa performa website

      mantapss. ikutan dong šŸ™

      posted in Diskusi Umum
    • Dockerize NodeJS web app

      Setup Dockerfile

      Buka text editor dan buat file baru bernama Dockerfile. Lalu kalian bisa copas semua kode di bawah ini ke file Dockerfile kalian.

      FROM node:10
      
      WORKDIR /usr/src/app
      
      COPY package*.json ./
      
      RUN npm install
      
      COPY . .
      
      EXPOSE 8080
      CMD [ "npm", "start" ]
      

      Apa yang kita lakukan diatas?

      • Line 1: Kita menggunakan image docker yang sudah terinstall node. Apa spesifikasi image node:10 ini? Kalian bisa cek ke repo docker nya disini pada section Image Variants (biasanya menggunakan os debian, kecuali kita spesifikasikan sendiri menggunakan os lain seperti Alpine Linux)
      • Line 3: Membuat working directory untuk app kita
      • Line 5: Copy package.json dan package-lock.json untuk diinstal terlebih dahulu. Kenapa tidak copy semua file aja dulu baru kemudian diinstall? Karena kita akan memanfaatkan build cache dari docker ketika kita membangun docker-image kita. Kita asumsikan file aplikasi kita (index.js dan mungkin nanti akan ada banyak file lainnya) akan selalu berubah, namun package tidak selalu berubah a.k.a lebih jarang berubahnya. Jadi ketika kita pisah, kita tidak perlu menunggu proses npm install yang memakan waktu, dan bisa gunakan build cache barusan.
      • Line 9: Copy file dari folder content_service ke dalam WORKDIR yang sudah tadi kita buat di dalam Docker image.
      • Line 11: Expose port yang kita gunakan pada aplikasi kita yaitu 8080
      • Line 12: Jalankan aplikasi

      Build image docker

      Sekarang kita bungkus aplikasi kita dengan perintah:

      $ docker build -t <username_dockerhub>/conten_service:v1.0.0 .
      

      jangan lupa di ujung command line diatas ada . itu menunjukan konteks folder mana yang akan kita build image nya.
      Oh iya buat yang bingung nyari username dockerhub dimana, teman-teman bisa login dulu di website docker

      Contoh perintah yang aku jalanin di komputerku:

      $ docker build -t alfredcrosby/content_service:v1.0.0 .
      

      Menghasilkan output seperti ini:

      Sending build context to Docker daemon  2.005MB
      Step 1/7 : FROM node:10
      10: Pulling from library/node
      c0c53f743a40: Pull complete
      66997431d390: Pull complete
      0ea865e2909f: Pull complete
      584bf23912b7: Pull complete
      3c4c73959f29: Pull complete
      63e05266fc4b: Pull complete
      1f4961ce4444: Pull complete
      6b0e52f69879: Pull complete
      3ed75ed173e8: Pull complete
      Digest: sha256:df200903ff34c07c1b9112b4fd9d1342c11eb7d99525f2b366c487f91dda8131
      Status: Downloaded newer image for node:10
       ---> aa6432763c11
      Step 2/7 : WORKDIR /usr/src/app
       ---> Running in 6ccfcfbf8f31
      Removing intermediate container 6ccfcfbf8f31
       ---> bf8a522f5fde
      Step 3/7 : COPY package*.json ./
       ---> 902f7a35ec7e
      Step 4/7 : RUN npm install
       ---> Running in 456895d69a75
      npm WARN [email protected] No description
      npm WARN [email protected] No repository field.
      
      added 50 packages from 37 contributors and audited 126 packages in 1.872s
      found 0 vulnerabilities
      
      Removing intermediate container 456895d69a75
       ---> 375a14d77c73
      Step 5/7 : COPY . .
       ---> 3e4826b88886
      Step 6/7 : EXPOSE 8080
       ---> Running in e408044836ae
      Removing intermediate container e408044836ae
       ---> ef9ce8c0570f
      Step 7/7 : CMD [ "npm", "start" ]
       ---> Running in 148a0c6865f3
      Removing intermediate container 148a0c6865f3
       ---> f75bb63355bf
      Successfully built f75bb63355bf
      Successfully tagged alfredcrosby/content_service:v1.0.0
      

      Jalankan aplikasi

      Yuk kita tes jalankan aplikasi kita dengan menjalankan perintah:

      $ docker run -p <port pilihanmu>:8080 -d <username_dockerhub>/content_service:v1.0.0
      

      Kalo di komputerku aku coba map dari port 8080 ke 5000 setelah dijalankan, akan muncul output seperti ini:

      $ docker run -p 5000:8080 -d alfredcrosby/content_service:v1.0.0
      0c906a20ee298ac053cd56bc067ffaffdd82201985c5ff529f0c476a397e6a30
      

      Cek aplikasi udah jalan atau belum?

      Bisa pakai command $ docker ps

      Output nya di komputer ku seperti ini:

      $ docker ps
      CONTAINER ID        IMAGE                                 COMMAND                  CREATED              STATUS              PORTS                    NAMES
      0c906a20ee29        alfredcrosby/content_service:v1.0.0   "docker-entrypoint.s…"   About a minute ago   Up About a minute   0.0.0.0:5000->8080/tcp   compassionate_snyder
      

      Untuk mastiin udah jalan

      Coba aja temen-temen buka http://localhost:<port yang kalian pilih> dan aplikasi kita akan tampil seperti sebelumnya šŸŽ‰

      Screen Shot 2020-03-28 at 15.47.12.png

      Untuk stop proses docker tadi gimana?

      Kalian bisa jalankan perintah ini $ docker stop <container_id>.
      Darimana dapat CONTAINER ID? dengan melihat output dari $ docker ps

      Selamat!!! Aplikasi Docker kalian sudah berhasil. Sisanya tinggal bagaimana cara deploy ke server production menggunakan docker.


      Kalo berhasil atau menemukan error ketika mencoba tutorial ini, langsung aja post di thread ini ya manteman šŸ™

      posted in Back End
    • Dockerize NodeJS web app

      Membuat Aplikasi NodeJS

      Pertama-tama, rekan-rekan bisa buat folder dulu untuk project nya. Namanya bebas terserah temen-temen. Kalo aku buat namanya: content_service ceritanya ini salah satu service dari banyak microservice di app kita. Dan setelah buat folder nya, lgsung masuk ke dalam folder dan jalankan perintah npm init

      $ mkdir content_service
      $ cd content_service
      $ npm init -y
      

      Setelah menjalankan ketiga perintah diatas harusnya akan muncul output seperti ini:

      Wrote to /Users/putualfredcrosby/osby/content_service/package.json:
      
      {
        "name": "content_service",
        "version": "1.0.0",
        "description": "",
        "main": "index.js",
        "scripts": {
          "test": "echo \"Error: no test specified\" && exit 1"
        },
        "keywords": [],
        "author": "",
        "license": "ISC"
      }
      

      Install package yang kita perlukan

      Kalo sudah muncul output tadi, sekarang kita install package yang kita butuhkan. Kita akan pakai microframework yang namanya sudah tidak async lagi di telinga kita. Yuppp Express JS. Langsung install aja:

      $ npm i -S express
      

      Akan muncul output seperti ini:

       ~/osby/content_service ī‚° npm i -S express
      npm notice created a lockfile as package-lock.json. You should commit this file.
      npm WARN [email protected] No description
      npm WARN [email protected] No repository field.
      
      + [email protected]
      added 50 packages from 37 contributors and audited 126 packages in 3.49s
      found 0 vulnerabilities
      

      Mulai Koding, Yaay! šŸŽ‰

      Sekarang saat nya kita mulai buat aplikasi kita šŸŽ‰ Buat file baru namanya index.js dan temen-temen bisa copas code ini ke file index.js yg kalian barusan buat.

      const express = require('express');
      
      const app = express();
      
      app.get('/', (req, res) => {
        res.send({ message: 'Hello BaliJS' });
      });
      
      const PORT = 8080;
      const HOST = '0.0.0.0';
      
      app.listen(PORT, HOST, () => {
        console.log(`Running on http://${HOST}:${PORT}`);
      });
      

      Apa aja yang kita lakukan diatas?

      • Line 1: Import library yg kita butuhkan, yaitu express
      • Line 3: Instantiating express. Bahasa sehari-harinya, kita panggil fungsi express js dengan cara express()
      • Line 5-7: Buat routing dengan path /, teman-teman bisa coba ganti dengan yang lain seperti /home, /login
      • Line 9-10: Kalian pasti paham
      • Line 12-14: Menjalankan server express pada host dan port yang sudah didefinisikan diatas.

      Selanjutnya

      Kalian bisa coba langsung jalankan app-nya dengan perintah: node index.js, tapi ada cara yang lebih elegan. Kita ubah dulu ya file package.json kita di bagian scripts: jadi seperti di bawah ini.

      {
        "name": "content_service",
        "version": "1.0.0",
        "description": "",
        "main": "index.js",
        "scripts": {
          "test": "echo \"Error: no test specified\" && exit 1",
          "start": "node index.js"
        },
        "keywords": [],
        "author": "",
        "license": "ISC",
        "dependencies": {
          "express": "^4.17.1"
        }
      }
      

      Perhatikan line 8, disana kita menambahkan satu command baru pada file package.json kita.
      Yuk, sekarang coba kita jalankan app kita, caranya -> npm start.

      $ npm start
      

      Kemudian harusnya muncul output seperti ini:

      $ npm start
      
      > [email protected] start /Users/putualfredcrosby/osby/content_service
      > node index.js
      
      Running on http://0.0.0.0:8080
      

      Kemudian coba buka browser dan akses alamat app kalian di http://localhost:8080.

      Tadaaa šŸŽ‰
      Screen Shot 2020-03-28 at 15.21.19.png

      Setup docker kita lanjut di post selanjutnya šŸ˜†

      posted in Back End
    • Dockerize NodeJS web app

      Tujuan tutorial ini adalah untuk mengenalkan ke teman-teman yang ingin belajar meng-kontainerisasi kan sebuah aplikasi. Oh iya, tutorial ini juga ditujukan untuk penggunaan di mode development, bukan mode production.

      Syarat

      Untuk mengikuti tutorial ini, diharapkan teman-teman sudah menginstall Docker dan NodeJS dan sudah berjalan dengan baik (tidak ada error).

      Tutorial ini dibagi menjadi dua bagian besar, yaitu: pertama kita akan membuat aplikasi NodeJS sederhana yang hanya akan menampilkan response json tanpa koneksi database, yang kedua adalah bagian setup docker nya itu sendiri.

      Penjelasan Singkat

      Docker akan membungkus aplikasi NodeJS kita dan semua dependency aplikasi kita (misal: package npm, library lain seperti driver database) ke dalam sebuah box yang biasa disebut container.

      Untuk membuat sebuah container, kita membutuhkan sebuah image yang biasanya sebuah sistem operasi seperti Ubuntu, Alpine Linux yang nanti nya akan digunakan oleh aplikasi kita untuk "hidup" disana beserta semua dependency nya.

      Oh iya FYI, host (komputer kita/ komputer server) dapat menjalankan beberapa docker container.

      Btw, kita lanjut di post selanjutnya yah šŸ˜†

      posted in Back End
    • Sharing Spotify playlist-mu untuk nemenin kamu kerja/belajar

      @Satya-Wikananda wah, niat bgt ngumpulin satu persatu wkwk, aku udah gak kuat kalo nyari2 dan ngumpulin tiap lagu. 🤣
      Thanks udah sharing playlistnya šŸ™

      posted in Diskusi Umum
    • Sharing Spotify playlist-mu untuk nemenin kamu kerja/belajar

      Screen Shot 2020-03-28 at 13.55.14.png


      Ini playlist yang selalu aku putar kalo lagi depan laptop šŸ˜† habis 1 playlist berulang2 seharian, ini bener-bener heavy rotation-ku 🤣


      Kalau playlist kalian gmn? šŸ˜†


      Edit:
      Ini link playlistnya: https://open.spotify.com/playlist/37i9dQZF1DXdbRLJPSmnyq?si=pcx4bmrGQq6GgyUNqUFZnw

      posted in Diskusi Umum
    • a Balinese Engineer's Concern and Hope

      9457446a0e6946a1829168bbf1b80747.jpg

      image source: https://id.pinterest.com/pin/272960427399509627/


      Tong nani, aeng sajan ngae judul

      Hehehe, jangan takut sama judulnya ya. Aku sekarang mau bahas apa yang terjadi di sekitar kita, tapi mungkin masih jarang diobrolin.
      Sebenarnya ini concern dari @wayanjimmy, @imdbsd dan aku yang dari lama sering kita obrolin

      Mau tanya dong

      Pernah gak temen-temen punya perasaan spt ini:

      • Males ikut komunitas ntar dibully karena aku masih newbie.
      • Males sharing di komunitas karena aku belum jago.
      • Males nanya di komunitas, kalo share kodinganku, aku malu nanti dilihat kodingan ku jelek, atau takut pertanyaanku terlalu sepele.
      • Males lah pokoknya ketemu orang-orang, aku mau belajar sendiri aja.

      Genks, kalian gak sendiri

      Jujur aku juga dulu punya pemikiran kaya gitu. Sejauh riset yg aku cermatin tentang perilaku yang aku sebut barusan diatas, aku gak bisa nyalahin siapapun. Kita udah terjebak di dalam budaya yang sudah diciptakan dari lama di lingkungan kita.

      Budaya orang yang ter-xxx(misal pintar, jago) lah yang boleh bicara. Dan sialnya beberapa orang yg spt itu (gak semua ya) malah menggunakan kemampuannya untuk melukai perasaan org lain (tanpa sadar) melalui respon nya.

      Sebagai contoh; misal Ketut Nyamprut baru belajar CSS dan dia nanya di komunitas seperti ini:

      Ketut Nyamprut: Permisi mas/mbak cara buat tombol bulat dgn css gimana?

      Lalu org2 toxic mulai jawab:

      toxic_people_1: mas, udah coba googling belum?
      toxic_people_2: bro sebelum tanya baca aturan forum dulu
      toxic_people_3: simple bgt masa gitu doang nanya sih? wkwkwk
      toxic_people_4: https://www.google.com/search?safe=strict&sxsrf=ALeKk00gXJd7AI16OVjNbW6Ycbuzc_4ctQ%3A1585370689940&ei=QdZ-XtWLOeuR4-EPt86kuAs&q=how+to+create+round+button+with+css&oq=how+to+create+round+button+with+css&gs_lcp=CgZwc3ktYWIQAzIFCCEQqwI6BAgAEEc6BwgjELACECc6BggAEAcQHjoECAAQDToICAAQCBAHEB46CggAEAgQBxAKEB46BggAEAgQHjoICAAQCBAKEB46AggAOggIABAIEA0QHjoECAAQHjoGCAAQDRAeUPlXWI9-YKiAAWgAcAJ4AIABTogB1wmSAQIxOZgBAKABAaoBB2d3cy13aXo&sclient=psy-ab&ved=0ahUKEwiVsL6GrrzoAhXryDgGHTcnCbcQ4dUDCAs&uact=5
      toxic_people_5: njir ngakak w sumpah sm pertanyaannya

      yang kaya gitu yang sering kita lihat bukan (ada yg cuma ngasi link google wkwkw vangke, oops šŸ˜“)?

      Genks, aku gak nyalahin mereka juga jawab kaya gitu. Memang sebaiknya kita googling dulu, atau baca aturan forum dulu sebelum bertanya. Point yang mau aku bahas adalah:

      Bisakah kita menggunakan bahasa yang lebih baik?

      Seandainya kita yg diposisi orang itu dan mendapatkan respon seperti itu, masih maukah kalian bertanya lagi? atau masih maukah ikut di komunitas itu?

      Aku sangat yakin kita gak akan mau bertanya lagi atau mending leave aja dari komunitas itu. Seandainya kalo si Ketut Nyamprut dapet jawaban seperti ini:

      nice_people_1: oh itu bisa pake property css namanya border-radius dan di set value nya 50%, contohnya kaya gini:

      .button {
       border-radius: 50%;
      }
      

      nice_people_2: Halo Ketut, ini jawabannya oh iya, jgn lupa selanjutnya liat aturan forum ya. Semoga membantu šŸ™
      nice_people_3: Hmm, aku kurang tau sih mungkin @komangmelon bisa membantu
      nice_people_4: Boleh tau apa aja yang sudah km coba @KetutNyamprut?

      Kalau dpt jawaban seperti diatas, Ketut Nyamprut gak cuma terbantu, tapi dia merasa nyaman. Ada sebuah komunitas yang mendukung proses dia belajar.

      Genks, kita orang Indonesia khususnya Bali, gak kekurangan orang jago, tapi kita kurang memiliki EMPATI (no-offense).

      Mungkin kita dulu pernah ngejawab pertanyaan kurang berkenan buat yang nanya, aku sarankan sekarang kita mulai belajar bareng-bareng jadi pribadi yang lebih EMPATI ke teman-teman yang baru belajar.

      Genks, kita pernah di posisi mereka juga, masih kesusahan belajar sesuatu. Kalau dpt respon yang baik dari komunitas, kita jadi semakin cepat belajar, dan secara gak langsung komunitas kita juga makin bertumbuh dari sisi jumlah dan kompetensi

      Jadi, tujuannya apa aku sharing kaya gini

      Aku mau ngajak temen-temen yang mungkin udah belajar duluan, yuukkk kita bantu temen-temen atau adik-adik kita yang masih sekolah biar mereka makin semangat belajar pemrograman.

      • Mari kita lebih ber-empati dan lebih sabar menjawab pertanyaan atau memberi masukan pada post yang mereka buat di komunitas ini.
      • Jangan ada bullying, jangan jd orang toxic
      • Jaga perasaan teman-teman atau adik-adik kita yang bertanya di komunitas ini.
      • Mari buat budaya yang baru, komunitas yang sehat, supaya tidak ada lagi orang yang males bertanya, males sharing, males ikut komunitas karena budaya komunitas yang masih feodal (cuma yg ter-xxx yg boleh jawab, sharing, dsb).
      • Intinya mari buat komunitas kita jadi tempat yang menyenangkan, kalau sudah menyenangkan proses belajar pun jadi lebih mudah.

      Akhir kata, yuk, semeton sambil pelan-pelan kita ubah Pulau Bali yang kita cintai, yang sekarang masih tourist-centric kita ubah jadi techno-centric.

      Thanks udah baca concern dari kami


      Mungkin temen-temen yang lain punya pengalaman yang beda dari pengalamanku, bisa di-share dgn membalas di thread ini.

      posted in Diskusi Umum
    • Sharing Belajar CSS untuk yang masih sekolah (SMP/SMA/SMK sederajat) cekidot!

      Pas lagi keliling di medsos tiba-tiba nemuin artikel tentang belajar CSS yang bagus dan ekstensif dan pake Bahasa Indonesia pula. Cocok banget untuk teman-teman yang baru akan mulai belajar pemrograman. 🤣 🤣

      Berikut beberapa screenshot tampilan tutorialnya:

      Rangkuman

      Screen Shot 2020-03-27 at 10.56.21.png


      Cara membuka file html di browser

      Screen Shot 2020-03-27 at 10.56.49.png


      Struktur penulisan CSS

      Screen Shot 2020-03-27 at 10.57.21.png


      Mengenal tampilan responsive

      Screen Shot 2020-03-27 at 10.57.54.png


      Langsung aja menuju TKP -> https://bosnaufal.github.io/css-itu-mudah/
      Credit Muhammad Naufal Rabbani.

      posted in Front End
    • Ayo kenalin dirimu!

      @Rizky-Aditya selamat datang šŸŽ‰ walaupun sering koding php, jangan ragu untuk sharing/bertanya apapun.
      Ada banyak jg yg kaya gitu disini 🤣 🤣

      posted in Diskusi Umum
    • Tombol reaction pada thread/topic (UX yang lebih baik)

      @alfinsuryaS ok fin, coba nanti kita update ya tombol2 reaction nya biar lebih jelas. Thanks masukannya fin šŸ™

      posted in Komentar dan Masukan
    • Fitur Notifikasi di Android

      @pandemuliada sip, baru aku pasangin šŸ™ bisa refresh dulu nanti kalo ada popup muncul di bawah di tap aja ya Mul. 🤣
      Kayanya mungkin ada kendala dikit, soalnya fitur notif ini terbatas bgt browser yg di support/test di hp.

      • Chrome
      • Safari
      • Firefox
      • Firefox OS (v1.2+)
      • Firefox Mobile (Android)

      berdasarkkan readme https://github.com/psychobunny/nodebb-plugin-desktop-notifications#browser-support

      posted in Komentar dan Masukan
    • SVG Vector Map Kecamatan di Indonesia?

      Halo semeton, saya sedang perlu sebuah library pemetaan kecamatan di Indonesia. Contohnya seperti di bawah ini, tapi per kecamatan.

      Screen Shot 2020-03-26 at 11.57.09.png

      Apakah semeton disini ada yang pernah membuat pemetaan per kecamatan? Kalo ada yg pernah, mohon berkenan referensi nya.

      Suksma šŸ™

      posted in Front End
    • Ayo kenalin dirimu!

      @Trimikha-Valentius halo kak, welcome di rumah baru 🤣 🤣

      posted in Diskusi Umum
    • Navigating the Hype-Driven Frontend Development World Without Going Insane - Kitze

      @satyakresna NAH WKWKWKW 🤣🤣

      posted in Front End
    • Navigating the Hype-Driven Frontend Development World Without Going Insane - Kitze

      @satyakresna bukan Happy Of Missing Out? 🤣🤣

      posted in Front End
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 5 / 7