Best of JavaScriptJune 2025

  1. 1
    Article
    Avatar of hnHacker News·48w

    Odyc.js

    Odyc.js is a lightweight JavaScript library designed to help users create interactive narrative games without requiring extensive programming knowledge. The library aims to make game development accessible to beginners while leveraging JavaScript's capabilities for creating engaging interactive experiences.

  2. 2
    Article
    Avatar of communityCommunity Picks·45w

    Neodrag: One draggable to rule them all

    Neodrag is a multi-framework JavaScript library that provides drag-and-drop functionality across React, Svelte, Vue, SolidJS, and vanilla JavaScript. It features a small bundle size (3.46KB), server-side rendering compatibility, TypeScript support, and consistent behavior across all supported frameworks through shared core logic.

  3. 3
    Article
    Avatar of awegoAwesome Go·45w

    Best Programming Language for 2026

    Python remains the top choice for AI/ML and automation, while Rust gains momentum for systems programming and blockchain development. JavaScript/TypeScript continues dominating web development, Go excels for backend microservices, and Swift/Kotlin rule mobile development. The guide provides career-specific language recommendations and emphasizes choosing based on your goals rather than popularity alone.

  4. 4
    Video
    Avatar of javascriptmasteryJavaScript Mastery·48w

    Build 3 Full-Stack Web Apps That Will Land You a Dev Job (12-Hour Full Course)

    A comprehensive 12-hour course teaching React development through building three production-ready applications: a movie app with trending features, a serverless file management system, and an AI-powered travel admin panel. Covers React 19 fundamentals, hooks, state management, component architecture, styling with Tailwind CSS v4, and deployment strategies. Uses modern tools like Next.js 15, Appwrite for backend services, and includes practical examples of authentication, file handling, and API integration.

  5. 5
    Video
    Avatar of javascriptmasteryJavaScript Mastery·46w

    Web Animations Full Course 2025 | Build an Awwwards Website & Master GSAP in Two Hours

    A comprehensive tutorial covering GSAP (GreenSock Animation Platform) fundamentals and building an award-worthy animated website. The course teaches essential GSAP methods including to, from, fromTo, timeline, stagger, and ScrollTrigger, then applies these concepts to create a cocktail landing page with smooth animations, parallax effects, and scroll-triggered interactions. Includes practical examples of integrating GSAP with React, text animations using SplitText plugin, and professional animation techniques used by top-tier agencies.

  6. 6
    Article
    Avatar of freecodecampfreeCodeCamp·49w

    The Front-End Monitoring Handbook: Track Performance, Errors, and User Behavior

    A comprehensive guide to building a frontend monitoring SDK from scratch, covering three main areas: performance monitoring (Core Web Vitals like FCP, LCP, CLS, plus API timing and resource loading), error tracking (JavaScript errors, Promise rejections, resource failures), and user behavior analytics (page views, scroll depth, click tracking). The tutorial provides practical code examples for implementing data collection using browser APIs like PerformanceObserver, MutationObserver, and various event listeners, along with reporting mechanisms and optimization techniques for production environments.

  7. 7
    Article
    Avatar of itnextITNEXT·45w

    Hacker Screen Builder

    A web-based tool that creates cinematic hacker-style interfaces through drag-and-drop widgets including satellite maps, 3D globes, progress bars, and facial recognition animations. Built using AI assistance from ChatGPT for ideation, Google AI Studio for frontend generation, and GitHub Copilot for backend development. Features customizable widgets, screen testing, and shareable links for saved configurations.

  8. 8
    Article
    Avatar of gcgitconnected·47w

    React 19 State Management: Context API and the New use() API Explained

    React 19 introduces the new use() hook as an alternative to useContext for accessing Context API values. The Context API enables global state management across components without prop drilling, making it ideal for shared data like authentication, themes, and cart information. The use() hook simplifies syntax by eliminating the need for useContext boilerplate and works with both contexts and async resources. While useContext remains stable for current projects, use() represents React's direction toward cleaner data access patterns, especially in server-driven environments.

  9. 9
    Article
    Avatar of communityCommunity Picks·47w

    iro.js

    iro.js is a JavaScript color picker widget that provides an SVG-based interface for selecting colors. It supports multiple color formats (hex, RGB, HSV, HSL, and kelvin temperatures) through a unified API, allows multiple colors for harmony selection, and requires no external dependencies. The library can be installed via NPM, CDN, or direct download, and offers customizable options, event handling, and easy integration with modern frameworks.

  10. 10
    Article
    Avatar of newstackThe New Stack·45w

    Node.js 24: Your Next Big Frontend Upgrade?

    Node.js 24 brings significant improvements including native TypeScript support, better ES Module compatibility, explicit resource management for automatic cleanup, and enhanced performance through V8 optimizations. Despite these advances, many developers continue using outdated versions like Node 12 and 18, creating security risks. The update addresses long-standing JavaScript challenges with resource management and introduces Watt, an application server that enables multi-threading and even PHP integration within Node.js applications.

  11. 11
    Video
    Avatar of primeagenThePrimeTime·46w

    THIS IS THE REAL VIBE CODING

    A developer discovers Strudel, a web-based live coding environment for music creation, and becomes fascinated by watching a live performance where code changes create real-time music. The tool allows musicians to write JavaScript-like code that generates beats, loops, and effects, with visual feedback showing how code modifications translate to audio output. The developer expresses excitement about learning this new form of creative coding that combines programming skills with musical performance.

  12. 12
    Article
    Avatar of communityCommunity Picks·45w

    Game Making Software

    Construct 3 is a browser-based game development platform that allows users to create games without coding knowledge or with JavaScript support. The tool emphasizes ease of use and accessibility for game creation directly in web browsers.

  13. 13
    Video
    Avatar of t3dotggTheo - t3․gg·47w

    Why Tech Companies Are Moving Off React

    A detailed analysis of why some tech companies are considering moving away from React, examining the framework's evolution through hooks, concurrent mode, server components, and the React compiler. The discussion argues that React's recent developments primarily benefit large-scale applications, addressing performance issues and complexity management that big companies face. The author counters claims that React is failing at scale, demonstrating how features like hooks improved code composability, server components solve server-driven UI problems, and the compiler optimizes performance automatically.

  14. 14
    Article
    Avatar of denoDeno·45w

    What's coming to JavaScript

    TC39's 108th meeting advanced 9 JavaScript proposals across different stages. Key features reaching stage 4 include explicit resource management with the `using` keyword for automatic cleanup, `Array.fromAsync` for handling async iterables, and `Error.isError` for reliable error detection. Stage 3 introduces immutable ArrayBuffers for safer binary data sharing. Stage 2 proposals include seeded random number generation and `Number.prototype.clamp` for value bounding. Stage 1 features focus on number formatting improvements, standardized value comparisons, and enhanced random utility functions. These additions aim to make JavaScript more powerful, safer, and developer-friendly.

  15. 15
    Article
    Avatar of gettothetopGet to the Top·46w

    Be a master at your craft

    Focus on mastering your chosen technology stack rather than chasing every new trend. Deep expertise in a specific area provides more satisfaction and career value than superficial knowledge across many technologies. Avoid getting distracted by overhyped frameworks and instead invest time in advancing your core skills.

  16. 16
    Article
    Avatar of svelte_developersSvelte Developers·48w

    JavaScript Framework Showdown: Why SvelteKit Emerges Victorious

    SvelteKit outperforms Next.js and Nuxt.js in the JavaScript framework competition through its revolutionary compilation approach that eliminates runtime overhead. Unlike traditional virtual DOM frameworks, SvelteKit compiles components into efficient vanilla JavaScript, resulting in smaller bundle sizes, faster load times, and superior performance. The framework offers a gentler learning curve while maintaining power, making it ideal for performance-critical applications where bundle size and runtime performance are crucial.

  17. 17
    Article
    Avatar of communityCommunity Picks·48w

    facebook/docusaurus: Easy to maintain open source documentation websites.

    Docusaurus is a static site generator built by Meta for creating and maintaining documentation websites. It offers simple setup with npm initialization, built-in localization support, customizable themes, and includes essential pages like docs, blog, and home sections. The project is open source, actively maintained, and designed to help developers focus on content rather than website infrastructure.

  18. 18
    Article
    Avatar of denoDeno·45w

    JavaScript™ Trademark Update

    Deno's fraud claim against Oracle's JavaScript trademark was dismissed by the Trademark Trial and Appeal Board, but the case continues with genericness and abandonment claims. Oracle must respond by August 7, with discovery beginning September 6. The goal is to free the JavaScript name from trademark restrictions, arguing it describes a programming language rather than an Oracle product.

  19. 19
    Article
    Avatar of 80lv80 LEVEL·46w

    Beautiful Liquid Glass Effect Made with Three.js

    Web developer Faraz Shaikh created a liquid glass effect using Three.js JavaScript 3D library. The effect features smooth drop-like shapes using MeshPhysicalMaterial with ray-marched surfaces built from Signed Distance Fields (SDFs). The demo and source code are available online, showcasing advanced 3D rendering techniques for creating realistic glass materials in web browsers.

  20. 20
    Article
    Avatar of codropsCodrops·47w

    Building an Infinite Parallax Grid with GSAP and Seamless Tiling

    A comprehensive tutorial on creating an infinitely scrolling image grid with parallax effects using GSAP. Covers dynamic tile generation from Figma layouts, smooth scroll and drag interactions, seamless tiling for infinite scrolling, visibility animations with IntersectionObserver, and polished intro animations. The implementation uses mathematical calculations for positioning, linear interpolation for smooth motion, and performance optimizations for web animations.

  21. 21
    Article
    Avatar of communityCommunity Picks·48w

    Just Fucking React to React

    Demonstrates how simple UI patterns like modals, dark mode toggles, forms, and accordions can be implemented using native HTML elements instead of complex React components. Shows side-by-side comparisons between vanilla HTML solutions and their React equivalents, highlighting how native web APIs often provide simpler alternatives to framework-heavy implementations.

  22. 22
    Video
    Avatar of awesome-codingAwesome·45w

    Node quietly dropped its biggest update in years...

    Node.js has released Amaro v1, a built-in TypeScript type stripping loader that allows developers to run TypeScript files directly without external build processes. This major update uses SWC under the hood and supports two modes: strip types (removes annotations) and transform types (handles advanced features like enums). Unlike previous experimental support, Amaro works with TypeScript files in node_modules, enabling entire dependency trees to run without pre-compilation. This brings Node.js closer to the seamless TypeScript experience offered by Deno and Bun, with plans to promote TypeScript support from experimental to stable status later this year.

  23. 23
    Video
    Avatar of huxnwebdevHuXn WebDev·47w

    Svelte 5 Complete Course ( 2025 )

    Svelte 5 is a modern JavaScript framework that compiles components into optimized vanilla JavaScript at build time, eliminating runtime bloat. Unlike React or Vue.js which use virtual DOM, Svelte directly updates the DOM for better performance. The framework features component-based architecture, reactive state management with runes, props for data passing between components, text interpolation for dynamic content, conditional rendering, loops with each blocks, snippets for reusable markup, and side effects handling. Key concepts include state management using state runes, derived values, children props for passing HTML content, and event handling with on:click syntax.

  24. 24
    Article
    Avatar of communityCommunity Picks·48w

    Eleventy LibDoc

    Eleventy LibDoc is a starter project template for creating responsive documentation sites using the Eleventy static site generator. It features accessibility-focused design, vanilla JavaScript components including search functionality, table of contents, code highlighting, and sandboxes. The template supports Markdown and HTML content creation, includes configurable navigation and blogging capabilities, and maintains printability and JavaScript-free functionality for essential features.

  25. 25
    Article
    Avatar of communityCommunity Picks·46w

    reactjs/react-basic: A description of the conceptual model of React without implementation burden.

    A theoretical exploration of React's conceptual model that breaks down UI development into fundamental concepts like transformation, abstraction, composition, state management, memoization, and algebraic effects. The document presents React as a system for transforming data into UI representations through pure functions, emphasizing how complex interfaces can be built through composition of simpler abstractions. It covers advanced concepts like memoization for performance optimization, state management patterns, and introduces algebraic effects as a way to handle cross-cutting concerns like theming without prop drilling.