JavaScript Indonesia Channel

Repository yang berisi kumpulan banyak yang berisi daftar tips dan trik dalam penggunaan Git Version Control

https://github.com/git-tips/tips

#git #vcs

GitHub

GitHub - git-tips/tips: Most commonly used git tips and tricks.

Most commonly used git tips and tricks. Contribute to git-tips/tips development by creating an account on GitHub.

621 viewsRian YW, 23:37

JavaScript Indonesia Channel

Membuat peta interaktif dengan library peta Leaflet JS

https://dev.to/sinhapiyush/interactive-maps-using-leaflet-559

---

Membuat fungsi tracking interaksi aplikasi web dan peristiwa error dengan JavaScript

https://format-express.dev/blog/how-to-track-client-side-javascript-errors

#leaflet #maps #tracking

DEV Community

Interactive Maps using Leaflet

Leaflet.js is an open-source JavaScript library for mobile-friendly interactive maps. It's lightweigh...

1.2K viewsRian YW, 00:30

JavaScript Indonesia Channel

Latihan dari Fireship tentang pengenalan SASS atau SCSS dan contoh penggunaannya

https://youtu.be/akDIJa0AP5c

---

#fireship #scss #css #sass #scss

YouTube

Sass in 100 Seconds

Learn the basics of Sass (SCSS) or syntactically awesome stylesheets. Sass is a language and complier the can make your CSS code more efficient and programmatic https://fireship.io/tags/css/

#css #webdev #100SecondsOfCode

🔗 Resources

Sass Docs https://sass…

776 viewsRian YW, 00:33

JavaScript Indonesia Channel

Membuat fungsi download file dengan Node JS

https://levelup.gitconnected.com/how-to-download-a-file-with-node-js-e2b88fe55409

---

Latihan menggunakan Nodemailer untuk berkirim email via Node JS

https://medium.com/@msudeep.joel/using-nodemailer-to-send-email-in-node-js-ee7deba5b3d7

—-

Membuat sistem authentication sederhana dengan Node JS, Sequlize, MySQL, Passport JS dan JSON Web Token JWT

https://medium.com/devc-kano/basics-of-authentication-using-passport-and-jwt-with-sequelize-and-mysql-database-748e09d01bab

—-

Referensi design pattern untuk Node JS microservice

https://blog.bitsrc.io/my-favorite-microservice-design-patterns-for-node-js-fe048c635d83

#nodejs #download #auth #jwt #passport #nodemailer #email

Medium

How To Download A File With Node.js

If you ever need to download a file with Node.js, here is a small script to achieve your goal.

1.0K viewsRian YW, 00:49

JavaScript Indonesia Channel

Latihan panjang mengunggah aplikasi Node JS MERN Stack ke server Heroku VPS

https://dev.to/chaoocharles/how-to-deploy-a-mern-stack-application-to-the-server-video-tutorials-56jk

—-

Membuat fungsi filter element dengan React JS

https://javascript.plainenglish.io/create-a-search-filter-app-with-react-and-javascript-5d05679f7315

—-

Membuat aplikasi web dengan Next JS dan TypeScript

https://www.freecodecamp.org/news/how-to-build-a-serverless-app/

---

#nodejs #mern #react #nextjs #heroku

DEV Community

How to deploy a MERN Stack Application to the Server 🚀 | Video Tutorials

Hello devs, in the following two video tutorials we are going to deploy a MERN backend(node.js app) t...

1.3K viewsRian YW, 00:52

JavaScript Indonesia Channel

Latihan bersama Web Programming Unpas untuk penggunaan JavaScript bersama Regular Expressions

https://youtu.be/oYybKjtArpA

#wpu #regex #es2015

YouTube

JavaScript Algorithms and Data Structures | #8 - Regular Expression (Bagian 1/3)

Belajar Bareng Javascript & Regular Expression di FreeCodeCamp | Part 1 | ketik !commands

https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/#es6

---
🔥 SUPPORT CHANNEL WEBPROGRAMMINGUNPAS 🔥

🎓 Ikuti KELAS ONLINE "Full Stack Web…

839 viewsRian YW, 06:07

JavaScript Indonesia Channel

Freecodecamp dan Farhan Hasin Chowdhury merilis panduan lengkap dan panjang untuk penggunaan NGINX Web Server. Selengkapnya bisa dilihat gratis dibawah ini

NGINX Handbook
https://www.freecodecamp.org/news/the-nginx-handbook/

---

Selain itu tersedia juga untuk Docker Handbook

https://www.freecodecamp.org/news/the-docker-handbook/

---

dan latihan penggunaan Kubernetes dalam Kubernetes Handbook

https://www.freecodecamp.org/news/the-kubernetes-handbook/

#kubernetes #docker #nginx #freecodecamp

freeCodeCamp.org

The NGINX Handbook – Learn NGINX for Beginners

A young Russian developer named Igor Sysoev was frustrated by older web servers' inability to handle more than 10 thousand concurrent requests. This is a problem referred to as the C10k problem. As an answer to this, he started working on a new web s...

4.1K viewsRian YW, 23:32

JavaScript Indonesia Channel

Beberapa fitur baru dari Next JS versi 10.x yang telah tersedia

https://blog.logrocket.com/whats-new-in-next-js-10-1/

---

Membuat form upload dengan Next JS

https://betterprogramming.pub/how-to-build-file-upload-forms-on-next-js-c92ad41c63f2

—-

Latihan menggunakan state management yang menggunakan Apollo GraphQL, Immer JS, React dan TypeScript

https://javascript.plainenglish.io/managing-local-state-in-react-with-apollo-immer-and-typescript-e966abe58476

—-

#nextjs #react #state #immer #typescript

LogRocket Blog

What's new in Next.js 10.1 - LogRocket Blog

Next.js 10.1 has a little something in it for everyone. In this article, we will explore these features in more detail.

884 viewsRian YW, 00:12

JavaScript Indonesia Channel

Membuat fungsi download file atau data dengan JavaScript

https://itnext.io/how-to-download-files-with-javascript-d5a69b749896

#download #file

Medium

How to Download Files With JavaScript

Downloading files is an essential aspect of surfing the internet. Tons of files are downloaded from the internet every day, from binary…

613 viewsRian YW, 00:24

JavaScript Indonesia Channel

Latihan panjang belajar mengenai CSS Media Query dengan membuat aplikasi web tertentu

https://www.freecodecamp.org/news/learn-css-media-queries-by-building-projects/

---

Mengenal parameter CSS Color Contrast API yang telah tersedia

https://css-tricks.com/exploring-color-contrast-for-the-first-time/

#css #mediaquery #contrast

freeCodeCamp.org

Learn CSS Media Queries by Building Three Projects

Today we're going to learn how to use CSS Media Queries to build responsive websites. And we'll practice what we learn by completing three projects. Let's go 🏅 Table of Contents What are CSS Media Queries? Steps to follow The Syntax Practice Projec...

1.5K viewsRian YW, 00:31

JavaScript Indonesia Channel

Latihan panjang dan lengkap tentang penggunaan CSS Custom Property untuk menentukan tema halaman web

https://css-tricks.com/a-complete-guide-to-custom-properties/

---

Latihan melakukan styling pada scrollbar halaman

https://www.freecodecamp.org/news/css-scrollbar-tutorial/

---

Latihan membuat animasi transisi easing in dan out dengan CSS

https://www.smashingmagazine.com/2021/04/easing-functions-css-animations-transitions/

---

Membuat transisi dengan element CSS yang saling berbagi dengan element lainnya

https://css-tricks.com/shared-element-transitions/

#css #customProperty #scrollbar #animation #transition

CSS-Tricks

CSS Custom Properties Guide | CSS-Tricks

Everything important and useful to know about CSS Custom Properties. Like that they are often referred to as "CSS Variables" but that's not their real name.

973 viewsRian YW, 00:50

JavaScript Indonesia Channel

Membuat tema warna untuk dipakai sebagai style dari Radio Button dan Checkbox

https://www.stefanjudis.com/snippets/how-to-style-and-define-the-color-of-radio-and-checkbox-inputs/

#css #radio #checkbox #colod

Stefanjudis

How to style radio and checkbox inputs with accent-color

Define the highlight color of radio and checkboxes using `accent-color` in CSS.

773 viewsRian YW, 00:58

JavaScript Indonesia Channel

Daftar tips dan trik penting dalam penggunaan CSS

https://dev.to/duomly/15-amazing-css-tips-and-tricks-you-should-know-2789

—-

Beberapa contoh implementasi Hover Effect dengan CSS dan HTML

https://dev.to/kiranrajvjd/12-simple-css-hover-effects-95d

#css #hover #tips

DEV Community 👩‍💻👨‍💻

15 amazing CSS tips and tricks you should know

This article was originally published at: https://www.blog.duomly.com/12-css-tips-and-tricks-which-he...

1.1K viewsRian YW, edited 01:58

JavaScript Indonesia Channel

Latihan panjang dan lengkap dari Freecodecamp dan Sanjeev Thiyagarajan membuat aplikasi backend modern dengan Node JS, Express JS, dan Dev Ops dengan Docker Container.

https://www.freecodecamp.org/news/learn-docker-by-building-a-node-express-app/
https://youtu.be/9zUHg7xjIqQ

---

Latihan lain dari Freecodecamp dan Sanjeev Thiyagarajan yaitu membuat aplikasi backend dengan Node JS, Express JS, dan Docker Container.

https://youtu.be/gm_L69NHuHM

---

Contoh lainnya adalah penggunaan Docker Container untuk pengembangan aplikasi berbasis React JS

https://youtu.be/3xDAU5cvi5E

#docker #nodejs #mern #express #devops #react

freeCodeCamp.org

Learn Docker by Building a Node / Express App

Docker is an open source project that makes it easy to create containers and container-based apps. Docker's lightweight and portable software containers simplify application development, testing, and deployment. We just released a course on the freeC...

2.3K viewsRian YW, 23:30

JavaScript Indonesia Channel

Mengenal sistem Reactivity yang baru di Vue JS 3

https://www.sitepoint.com/vue-3-reactivity-system/

---

Latihan membuat kloning aplikasi Whatsapp dengan Vue JS dan Firebase

https://javascript.plainenglish.io/lets-build-a-whatsapp-clone-using-vue-js-and-firebase-57a306b58e54

—-

Memaksa komponen Vue JS untuk render ulang halaman

https://javascript.plainenglish.io/how-to-force-vue-js-to-reload-or-re-render-a-component-58236b9ccb84

—-

Beberapa cara komunikasi antar Vue JS Component

https://dev.to/sanchithasr/how-to-communicate-between-components-in-vue-js-kjc

---

#vue #render #firebase #whatsapp #clone

Sitepoint

Understanding the New Reactivity System in Vue 3 — SitePoint

Vue 2's reactivity system was good but had limitations. Learn why Vue 3's new, feature-rich reactivity API is far more flexible and powerful than before.

830 viewsRian YW, 23:31

JavaScript Indonesia Channel

Melakukan testing endpoint API dengan Cypress IO

https://dev.to/leading-edje/api-testing-with-cypress-4p8n

—-

Contoh end to end testing dengan Cypress IO

https://betterprogramming.pub/how-to-perform-end-to-end-testing-on-your-web-apps-with-cypress-io-47997375bad4

#cypress #testing

DEV Community

API Testing with Cypress

In this post we'll talk about using Cypress to run API tests. But what is Cypress? Cypress is an op...

371 viewsRian YW, 23:51

JavaScript Indonesia Channel

Latihan panjang dari channel Thu Nghiem tentang membuat animasi element web dengan CSS Transition, Transform, Keyframe, dan CSS Animation

https://youtu.be/XwTjdPp-T_M

#css #animation #thunghiem

YouTube

Animate a Website using CSS (transition, transform, keyframes, animation) | CSS Tutorial

To make your website stand out, you can use Animation in CSS. And it does not have to be complicated.

Download the resources: https://devchallenges.io/learn/tutorial/css-animation

__________ 🔖 Tutorial Structure __________

- Intro --
[00:00] - Introduction…

594 viewsRian YW, 00:01

JavaScript Indonesia Channel

Latihan dari Dcode tentang pengenalan JavaScript Console API untuk proses debugging JavaScript

https://youtu.be/VsaDOHqTWCM

#dcode #console #debugging

YouTube

Top 5 JavaScript Console Features 👨‍💻

In today's video I'll be going over my top 5 favourite JavaScript console features to help speed up your front-end development workflow. Many if not all of these features are supported in modern browsers such as Chrome, Firefox and Safari.

Features covered:…

665 viewsRian YW, 00:03

JavaScript Indonesia Channel

Mengirim pesan antar tab halaman yang dibuka dengan Broadcast Channel API dari JavaScript

https://twitter.com/SimonHoiberg/status/1387749010572730372

#tabs #broadcast #channel

Twitter

Simon Høiberg

JavaScript Tip 💡 Did you know that you can use the Broadcast Channel API to do basic communication between browser tabs, windows, and iframes? It's pretty simple 🙌

1.1K viewsRian YW, 00:42

JavaScript Indonesia Channel

Latihan dasar cara melakukan Git Push ke remote origin dari repository Github atau Gitlab

https://www.freecodecamp.org/news/git-push-to-remote-branch-how-to-push-a-local-branch-to-origin/

---

#git #push