Latihan panjang sekali membuat aplikasi sosial media dengan stack modern Node JS yaitu MERN dan GraphQL

https://www.freecodecamp.org/news/learn-how-to-use-react-and-graphql-to-make-a-full-stack-social-network/

---

Membuat aplikasi web daftar belanjaan dengan React dan React Hooks.

https://www.freecodecamp.org/news/how-to-build-a-shopping-list-using-react-hooks-w-starter-code-and-video-walkthrough/

---

Membuat list yang isi komponennya dapat di drag and drop pada React JS

https://codedaily.io/tutorials/186/Multi-List-Drag-and-Drop-With-react-beautiful-dnd-Immer-and-useReducer

---

Membuat aplikasi catatan Notes App dengan React JS , Router , dan Redux

https://medium.com/javascript-in-plain-english/using-react-react-router-redux-redux-form-in-building-simple-notes-app-fd3114f5131a

#react #hooks #list #drag #drop #notes #router #redux #nodejs #mern #socialmedia #graphql

Mengenal tag HTML yang jarang dipakai tapi berguna, yaitu kbd tags, yang biasa dipakai untuk menampilkan tampilan pintasan keyboard atau shortcut di HTML


https://dev.to/braydoncoyer/the-kbd-html-tag-2n2o

---

Live editor untuk Bulma CSS yang dapat dipakai untuk testing tampilan Bulma CSS

https://dev.to/sm0ke/bulma-css-open-source-live-editor-b9m

---

Latihan dari CSS Tricks tentang membuat marker dari List Element agar ke posisi tengah element

https://youtu.be/kO2dZxtsC1M

#kbd #keyboard #tag #html #list #center #bulma

Daftar library JavaScript yang membantu proses pengembangan aplikasi web modern berbasis Node JS

https://javascript.plainenglish.io/31-awesome-javascript-libraries-c8bdd78ed1dc

https://javascript.plainenglish.io/javascript-frameworks-libraries-35931e187a35

—-

Latihan sederhana membuat aplikasi blog dengan Express JS

https://javascript.plainenglish.io/node-js-series-part-2-create-a-simple-blog-app-with-express-js-5449604850fa

—-

Pengenalan teknik routing endpoint API di Express JS

https://javascript.plainenglish.io/express-js-getting-started-basic-routing-938d8b629fe2

—-

#nodejs #express #list #routing

Daftar resource belajar penting "Awesome JavaScript" untuk belajar pengembangan aplikasi JavaScript dan Node JS

https://javascript.plainenglish.io/my-take-on-awesome-javascript-243255451e74

#nodejs #awesome #list

Memperbaiki SEO pada aplikasi Next JS pada bagian perubahan tampilan halaman

https://blog.logrocket.com/fix-layout-shifts-improve-seo-next-js/

---

Pengenalan dan latihan membuat aplikasi web dengan Next JS

https://dev.to/educative/next-js-tutorial-with-examples-build-better-react-apps-with-next-2875

---

Optimasi performa render halaman pada element berbentuk List di React JS

https://betterprogramming.pub/how-to-improve-rendering-performance-in-a-1-000-item-react-list-85be129b8c0d

---

Membuat visualisasi data dengan grafik atau Chart dengan Kendo UI dan React JS

https://www.telerik.com/blogs/data-visualization-build-react-graphs-easy-way

---

Cara menyimpan data sederhana di browser pada aplikasi React JS

https://dev.to/audreyhal/persisting-files-in-javascript-react-applications-3fah

#nextjs #react #kendo #list #seo

Latihan penggunaan Input Form dan Label pada contoh kasus tertentu

https://css-tricks.com/html-inputs-and-labels-a-love-story/

---

Latihan membuat element tombol dengan efek 3D

https://www.joshwcomeau.com/animation/3d-button/

---

Membuat element List dengan CSS Counter API

https://www.joshwcomeau.com/css/styling-ordered-lists-with-css-counters/

---

Cara mendeteksi klik cursor di luar element tertentu dengan JavaScript

https://css-tricks.com/click-outside-detector/

---

#css #label #input #button #form #click #outside #list

Tips membuat list element di Vue JS yang tidak lag ketika di scroll

https://blog.logrocket.com/create-performant-virtual-scrolling-list-vuejs/

—-

Membuat multistep form input dengan Vue JS

https://javascript.plainenglish.io/how-to-build-a-multi-step-form-using-vue-js-d00efc5f05f4

#vue #list #multistep

Latihan panjang dari Traversy Media membuat fitur drag and drop dari List atau daftar element di HTML

https://youtu.be/wv7pvH1O5Ho

#traversyMedia #list #drag #drop

Membuat element List dengan unordered list atau ul

https://www.freecodecamp.org/news/html-bullet-points-how-to-create-an-unordered-list-with-the-ul-tag-example/

---

End to end testing Cypress untuk menguji fungsi CSS di HTML

https://levelup.gitconnected.com/testing-css-visibility-with-cypress-e852085fc15b

#css #html #cypress #ul #list

Latihan bersama Cand Dev membuat aplikasi kamus atau Dictionary dengan React JS dan Tailwind CSS

https://www.youtube.com/watch?v=BfnbPwqHhfY

---

Mengembalikan posisi Scroll halaman pada aplikasi React JS

https://blog.logrocket.com/maintain-restore-scroll-position-react-mobile-apps/

#candDev #react #tailwind #list #scroll

Mengenal beberapa fitur JavaScript modern yang dapat membantu penulisan kode menjadi lebih rapi

https://javascript.plainenglish.io/write-better-code-with-these-5-javascript-features-cf405b25a78e

---

Kumpulan snippet atau potongan kode JavaScript yang sering ditemui dan dipakai sehari hari

https://javascript.plainenglish.io/12-useful-javascript-snippets-for-everyday-problems-4f08ee1ab5e

---

Latihan menggunakan setTimeout untuk memberikan jeda pada eksekusi proses

https://dev.to/dailydevtips1/using-settimeout-in-javascript-2mmc

---

Membuat list dan cara memperbarui isi list dengan menggunakan JavaScript

https://javascript.plainenglish.io/working-with-the-dom-in-vanilla-js-apps-part-2-ebd9a8064f6c

---

#snippet #dom #list #timeout

Daftar command NPM yang perlu diketahui bagi pengembang aplikasi web

https://blog.bitsrc.io/the-most-pertinent-npm-commands-and-shortcuts-you-should-know-as-javascript-developer-d84e34f6fe32

---

Mendapatkan nilai unik dari suatu Array JavaScript

https://javascript.plainenglish.io/how-to-get-unique-values-from-a-list-in-javascript-301675602985

---

Mengenal apa itu Hoisting di JavaScript

https://javascript.plainenglish.io/lets-understand-hoisting-in-javascript-99d9df022ce8

---

Membuat toggle Dark Mode dengan JavaScript dan LocalStorage

https://javascript.plainenglish.io/build-a-dark-mode-toggle-with-javascript-and-localstorage-8022b492fb9e

---

Mengenal beberapa library JavaScript yang dapat dipakai untuk visualisasi data

https://javascript.plainenglish.io/5-awesome-javascript-libraries-for-data-visualization-837aea38c574

---

#npm #list #unique #visualization #darkmode #hoisting

Latihan keren dari Online Tutorials tentang membuat hover effect pada element List di HTML

https://www.youtube.com/watch?v=kcS1_RC3cRY

---

Mengenal beberapa property CSS yang jarang diketahui

https://javascript.plainenglish.io/9-awesome-css-properties-that-you-probably-have-never-used-8cc4c385c3c6

#onlineTutorials #list #hover #css

Latihan panjang membuat Todo List dengan Vue JS

https://dev.to/smpnjn/making-a-to-do-list-in-vue-31on

----

Memahami penggunaan custom directive pada Vue JS

https://blog.logrocket.com/deep-dive-custom-vue-directives/

#vue #directive #todo #list

Pengenalan container query pada CSS

https://blog.openreplay.com/css-container-style-queries/

---

Penjelasan sederhana tentang Viewport unit di CSS

https://web.dev/viewport-units/

---

Melihat fitur baru pada element list di HTML

https://css-tricks.com/newer-things-to-know-about-good-ol-html-lists/

#css #container #query #list #html #viewport

Latihan bersama Dcode membuat aplikasi Todo List dengan JavaScript, HTML, dan CSS

https://www.youtube.com/watch?v=cijPd-TXPn4

#todo #list #dcode #css #html

Menambahkan fungsi translasi bahasa di React JS dengan library format JS


https://blog.logrocket.com/translate-react-app-using-format-js/

—-

Membuat data list di React JS dengan Array.map

https://www.freecodecamp.org/news/how-to-render-lists-in-react/

#react #list #array #map

Latihan menggunakan list element di HTML

https://www.freecodecamp.org/news/html-lists-with-examples/

#list #element #html

Cara membuat style pada list dengan CSS dan HTML bersama Kevin Powell

https://www.youtube.com/watch?v=bRYwmmLC_Ns

#css #list #html #kevinPowell

React DND Kit: Creating Vertical Sortable Lists Tutorial
https://www.youtube.com/watch?v=wmk50PEsVrs

—-

Implementing Password Strength Checks, Password Recovery, and Email Handling with Next.js 14, NextAuth.js, and Resend
https://javascript.plainenglish.io/implementing-password-strength-checks-password-recovery-and-email-handling-with-next-js-562504f67e24

—-

#react #sort #list #nextjs #email #password