JavaScript Indonesia Channel – Telegram

JavaScript Indonesia Channel

@Indonesia_Javascript

12K subscribers

589 photos

6 videos

3 files

15.8K links

Channel yang berisi kumpulan berita atau konten seputar JavaScript, Typescript, HTML, CSS, Library, Framework JS, Node.js , dan juga engine-nya

Untuk pencarian artikel,gunakan fitur pencarian di channel ini,dan bisa juga dicari berdasarkan hashtag #

Download Telegram

About

Blog

Apps

Platform

JavaScript Indonesia Channel

12K subscribers

JavaScript Indonesia Channel

Membuat animasi gambar bergulung dengan menggunakan Three JS

https://tympanus.net/codrops/2020/01/22/how-to-unroll-images-with-three-js/

#image #threejs #rolling #scrolling

How to Unroll Images with Three.js | Codrops

Do you like to roll up things? Or maybe you prefer rolling them out? I spent my childhood doing crepes. I loved those ro

357 viewsRian YW, 01:11

JavaScript Indonesia Channel

Membuat tampilan chart peta dengan efek 3D , dengan menggunakan fungsi WebGL, D3 JS , dan Three JS

https://tips4devs.com/articles/make-a-webgl-powered-us-counties-map-with-d3-and-three-js.html

#maps #webgl #d3 #threejs

US Counties Map in WebGL using D3 and Three.js

This tutorial will take you through the main steps of making a WebGL powered US Counties Map with D3 and Three.js

1.4K viewsRian YW, 00:50

JavaScript Indonesia Channel

Membuat game Fruit Ninja dengan Javascript Three JS , dan TensorFlow JS , dan dikontrol dengan gerakan tangan di kamera

https://dev.to/devdevcharlie/motion-controlled-fruit-ninja-game-using-three-js-tensorflow-js-18de

Demo
https://splat.netlify.app/

#tensorflow #nodejs #threejs

824 viewsRian YW, edited 04:33

JavaScript Indonesia Channel

9 Tips penting dalam menggunakan metode manipulasi Array di Javascript

https://dev.to/galelmalah/9-great-tips-to-use-array-methods-like-a-pro-dcc

---

Beberapa cara untuk mencari element tertentu di dalam Array dengan Javascript

https://medium.com/javascript-in-plain-english/searching-for-array-elements-using-javascript-array-instance-methods-51ed6383b4fa

---

Latihan pengenalan Three JS untuk pembuatan game Javascript

https://blog.logrocket.com/intro-to-three-js-for-game-developers/

---

Beberapa library Javascript yang sedang trending di Github

https://dev.to/iainfreestone/10-trending-projects-on-github-for-web-developers-9th-october-2020-247g

#array #method #findIndex #map #threejs #library

9 Great Tips To Use Javascript Array Methods Like a Pro!

As a developer, I always reflect upon the code I write and read. Through this process, I have collect...

541 viewsRian YW, 01:42

JavaScript Indonesia Channel

Membuat aplikasi Next JS dengan Apollo Client dan Slash GraphQL Service

https://www.apollographql.com/blog/building-a-next-js-app-with-apollo-client-slash-graphql/

---

Membuat teks editor WSYIWG di aplikasi React JS dengan Draft JS dan react-draft-wysiwyg

https://blog.logrocket.com/building-rich-text-editors-in-react-using-draft-js-and-react-draft-wysiwyg/

---

Menggunakan Three JS di dalam aplikasi React JS dengan React Three Fiber library

https://www.smashingmagazine.com/2020/11/threejs-react-three-fiber/

—-

Eksplorasi Image Component baru di Next JS 10

https://medium.com/javascript-in-plain-english/exploring-the-new-image-component-with-next-js-10-cc0f70548886

#react #wysiwyg #draftjs #threejs #image #nextjs #graphql #apollo

Apollo GraphQL Blog

Building a Next.js App with Apollo Client & Slash GraphQL

Slash GraphQL is a managed GraphQL cloud service that gives your app a /graphql API endpoint from nothing more than your app’s GraphQL schema. It’s the fastest way to start a GraphQL app. In this blog post, we will build a simple NextJS app from scratch,…

998 viewsRian YW, 01:50

JavaScript Indonesia Channel

Latihan membuat animasi di dalam Canvas dengan Three JS dari channel Design Course.

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

---

Membuat efek partikel hujan dengan Three JS

https://tympanus.net/codrops/2021/03/17/tropical-particles-rain-animation-with-three-js/

—-

Latihan dasar memulai menggunakan Three JS untuk animasi di dalam aplikasi web

https://javascript.plainenglish.io/getting-started-with-three-js-e0941324b624

#threejs #designcourse #canvas

Getting Started with THREE.JS in 2021!

https://bit.ly/3vveoV6 - Become a frontend developer (50% off limited time!)
-- Want to learn UI/UX? https://designcourse.com
-- Check out Bruno's Three.js Course: https://bit.ly/3qU6elv (30% off for the first 15 students, using my code! Note, this is not…

583 viewsRian YW, 00:05

JavaScript Indonesia Channel

Latihan membuat efek smooth scroll dan Ray tracing dengan Three JS dari channel Design Course

https://youtu.be/U29j5NiSMVQ

#threejs #smoothscroll #raytracing

Creating Smooth Scroll & Raycasting with ThreeJS

https://bit.ly/3rAfKur - Become a frontend developer (50% off limited time!)
-- Want to learn UI/UX? https://designcourse.com
-- Today, we're stepping right back into Three.js to learn some new techniques that are quite popular. These techniques are learning…

690 viewsRian YW, 00:23

JavaScript Indonesia Channel

Latihan dari Design Course membuat halaman web dengan efek animasi partikel tiga dimensi dengan library Three JS

https://youtu.be/dLYMzNmILQA

#threejs #designcourse #animation

Working with Three.js Particle Systems - They're AWESOME!

https://bit.ly/3uIxMN5 - Become a frontend developer (50% off limited time!)
-- Want to learn UI/UX? https://designcourse.com
-- Today, we're going to step back into the world of Three.js to take a look at particle systems / effects. This is an introductory…

636 viewsRian YW, 23:51

JavaScript Indonesia Channel

Latihan panjang dari Fireship tentang latihan menggunakan Three JS untuk membuat halaman portfolio dengan efek animasi 3D

https://youtu.be/Q7AOvWpIVHU

#fireship #portfolio #threejs

Build a Mindblowing 3D Portfolio Website // Three.js Beginner’s Tutorial

Learn the basics of Three.js - a tool for building amazing 3D graphics with JavaScript. In this tutorial, we create an animated 3D scrolling animation for a portfolio website https://github.com/fireship-io/threejs-scroll-animation-demo

#3D #webdev #js

🔗…

629 viewsRian YW, 23:45

JavaScript Indonesia Channel

Kumpulan beberapa tag HTML yang jarang diketahui namun sangat bermanfaat untuk struktur semantic HTML yang lebih baik, accessibility, dan juga SEO yang lebih baik

https://blog.logrocket.com/uncommon-html-tags-improve-web-semantics/

---

Latihan penggunaan SVG pada Three JS

https://blog.logrocket.com/bringing-svgs-three-js-svgloader/

---

Beberapa fungsi kalkulasi atau perhitungan di CSS yang sudah bisa digunakan

https://css-tricks.com/using-absolute-value-sign-rounding-and-modulo-in-css-today/

---

Beberapa hal yang perlu diketahui tentang CSS Units atau satuan variabel dalam CSS

https://medium.com/weekly-webtips/everything-you-need-to-know-about-css-units-d68f6ad0e5d5

—-

Beberapa fitur keunggulan framework Bulma CSS untuk styling tampilan aplikasi web

https://blog.bitsrc.io/why-developers-love-bulma-css-8d9aab97fd0c

—-

Pengenalan CSS Position property untuk mengatur posisi element di HTML

https://medium.com/techtofreedom/css-position-locate-your-html-elements-like-a-guru-3fb618654e74

—-

#css #html #seo #semantic #unit #threejs #calculation #svg

Uncommon HTML tags that improve web semantics - LogRocket Blog

Learn the proper way to use uncommon HTML tags that'll make for a more semantic website, better accessibility, and improved SEO.

640 viewsRian YW, 00:37

JavaScript Indonesia Channel

Latihan dari Freecodecamp tentang membuat permainan Squid Games dengan menggunakan Three JS

https://www.freecodecamp.org/news/create-a-squid-game-javascript-game-with-three-js/

#game #freecodecamp #threejs

freeCodeCamp.org

Create a Squid Game JavaScript Game with Three.js

Would you survive the TV show Squid Game? Would you survive coding the TV show Squid Game? Time to find out. We just published a JavaScript course on the freeCodeCamp.org YouTube channel that will teach you how to create the Red Light / Green Light game from…

784 views23:50

JavaScript Indonesia Channel

Latihan menggunakan Three JS untuk animasi sederhana

https://medium.com/geekculture/getting-started-with-three-js-1c2d02e18330

#threejs

Getting Started With Three.js

The ability to render 3D objects in the browser opens up many exciting possibilities for creating interactive experiences. Whether you’re…

362 views23:38

JavaScript Indonesia Channel

Latihan dari Web Programming Unpas dalam membuat Kartu Ucapan Idul Fitri Menggunakan THREE JS & Tailwind CSS

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

#wpu #threejs #tailwind #css #ngobar

Membuat Kartu Ucapan Idul Fitri Menggunakan THREE JS & TAILWIND CSS | NGOBAR #34

Membuat kartu ucapan sederhana menggunakan ThreeJS dan Tailwind CSS 3

▬▬▬▬ Chapters ▬▬▬▬▬▬▬▬▬▬
00:00 - Intro
01:24 - Persiapan menggunakan ThreeJS
05:19 - Membuat object 3D
18:37 - Menggunakan object 3D yang sudah jadi
29:12 - Membuat kartu ucapan menggunakan…

986 views23:00

JavaScript Indonesia Channel

Latihan panjang dari Freecodecamp membuat clone game Minecraft dengan Three JS dan React JS

https://www.freecodecamp.org/news/code-a-minecraft-clone-using-react-and-three-js/

—-

Latihan sederhana cara menggunakan Props di React JS

https://www.freecodecamp.org/news/how-to-use-props-in-reactjs/

#react #props #threejs #minecraft #clone

freeCodeCamp.org

Code a Minecraft Clone Using React and Three.js

It may not be possible to code a Minecraft clone in 30 seconds [https://www.youtube.com/watch?v=MAlSjtxy5ak], but you can definitely create one in under two hours. We just published a course on the freeCodeCamp.org YouTube channel that will teach you how…

697 views00:13

JavaScript Indonesia Channel

Latihan dari Lama Dev membuat web portfolio dengan React dan Three JS

https://www.youtube.com/watch?v=qALsVa-V9qo

—-

Komparasi antara Next JS dengan Remix JS

https://blog.openreplay.com/comparing-frameworks--next-vs-remix/

—-

Beberapa library chart dan grafis untuk React JS

https://blog.openreplay.com/exploring-the-best-react-charting-libraries-for-2023/

—-

Menggunakan Vite bundler pada React JS

https://medium.com/@s_eschweiler/vite-react-the-ultimate-combination-for-fast-project-setup-b571adcb3f7

—-

#react #nextjs #portfolio #vite #threejs #lamaDev

React 3D Portfolio Website with Three.js | Build and Deploy Responsive React Portfolio

Responsive 3d portfolio page tutorial for beginners using React and Three.js. Get Hostinger Discount: http://hostinger.com/lamadev Coupon Code: LAMADEV

If it is valuable to you, you can support Lama Dev.
Join: https://www.youtube.com/channel/UCOxWrX5MId…

568 views23:10

JavaScript Indonesia Channel

Latihan panjang dari JavaScript Mastery membuat aplikasi portfolio dengan React JS dan Three JS

https://www.youtube.com/watch?v=0fYi8SGA20k

#react #javascriptMastery #threejs

Build and Deploy an Amazing 3D Web Developer Portfolio in React JS | Beginner Three.js Tutorial

The most impressive websites in the world use 3D graphics and animations to bring their content to life. Learn how to build your own ThreeJS 3D Developer Portfolio today!

What to do after mastering Three JS? Master the most powerful web dev framework today…

658 views01:13

JavaScript Indonesia Channel

Membuat sistem tata surya dengan bantuan Three JS

https://hackernoon.com/how-to-create-a-solar-system-in-javascript-with-threejs?source=rss

—-

Beberapa fungsi shorthand dalam JavaScript

https://lokesh-prajapati.medium.com/javascript-shorthand-techniques-ultimate-cheat-sheet-415d9abbe47c

—-

Optimasi dalam memuat file JavaScript

https://www.lambdatest.com/blog/how-to-reduce-page-load-time-javascript/

—-

#solar #threejs #optimize #shorthand

How to Create a Solar System in JavaScript With Three.js 🌌 | HackerNoon

Create a Solar System in JavaScript with Three.js by using this guide!

534 views00:45

JavaScript Indonesia Channel

Implementasi desain blender dengan bantuan Three JS di React JS

https://www.freecodecamp.org/news/blender-three-js-react-js/

---

Cara membuat protected route di React JS

https://dev.to/sundarbadagala081/protected-routes-in-react-47b1

---

Cara melakukan handling error di Next JS

https://blog.logrocket.com/common-next-js-errors/

---

#react #nextjs #blender #threejs #router

freeCodeCamp.org

How to Implement a Blender Model in a React.js Application using Three.js

In this step-by-step guide, you'll learn how to build a basic Blender file with incorporated fundamental animations. After that, you'll learn how to integrate Three.js with your React apps using React Three Fiber. Getting familiar with these concepts can…

733 views23:43

JavaScript Indonesia Channel

Javascript Mastery - Build and Deploy and Amazing 3D Developer Portfolio with React and Three JS

https://youtu.be/FkowOdMjvYo?si=iHp0LY0o8mir-oBe

#react #threejs #javascriptMastery #portfolio

Build and Deploy an Amazing 3D Developer Portfolio in React with Three.js

Let's build a cool 3D website together! You'll learn how to make a portfolio with fun interactive parts, like a floating island and a fox that moves when you type. It'll allow you to show off your skills and get a job!

🌟 Become a top 1% Next.js 14 developer…

772 views22:08

JavaScript Indonesia Channel

Build and Deploy an Apple Website using React | Beginner Three.js & GSAP Tutorial
https://www.youtube.com/watch?v=kRQbRAJ4-Fs

#react #javascriptMastery #gsap #threejs

Beginner Three.js & GSAP Tutorial | Build and Deploy an Apple Website using React

Recreate the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects. From custom animations to animated 3D models, this tutorial covers it all.

⭐ Hostinger - https://hostinger.com/mastery10
Use the code JAVASCRIPTMASTERY to save up…

383 views23:35