JavaScript front-end

Open-source JavaScript projects categorized as front-end
Edit details
Topics: #JavaScript #React #HTML #JS #CSS
Write Clean JavaScript Code. Always.
Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
www.sonarsource.com
Sponsored

Top 23 JavaScript front-end Projects

  • Dragula

    :ok_hand: Drag and drop so simple it hurts

    Project mention: Made a free website for practicing what's taught in Tobira: Gateway to Advanced Japanese | /r/LearnJapanese | 2022-12-16

    Yup, I wrote the majority of the site's functionality using vanilla JS. I did use dragula for the drag and drop and easytimer for the timing though.

  • Bower

    A package manager for the web

    Project mention: 5 NPM Alternatives You Should Try | dev.to | 2023-03-04

    Bower is a package manager specifically designed for front-end web development. It can be used to manage JavaScript, CSS, and HTML packages and dependencies. It was developed by Twitter and is known for its simplicity and ease of use. However, it is worth noting that Bower is no longer actively maintained, and developers are encouraged to use other package managers like Yarn or PNPM instead.

  • Amplication

    Amplication: open-source Node.js backend code generator. An open-source platform that helps developers build backends without spending time on boilerplate & repetitive coding. Including production-ready GraphQL & REST APIs, DB schema, DTOs, filtering, pagination, RBAC, & more.

  • front-end-guide

    📚 Study guide and introduction to the modern front end stack.

  • single-spa

    The router for easy microfrontends

    Project mention: Use web components for what they’re good at | news.ycombinator.com | 2023-08-23

    I’ve actually done that “web components as the interoperability layer”!

    It was this old angular 1.8 app with new features being written in angular-hybrid-ized angular 8. Ripping out angular-hybrid and separating the angular 1.8 routes from the modern angular routes was difficult, but now they were totally separate.

    The only thing linking them together was an object with some RXJS streams in it for state, and a little in-house wrapper “app” who just loaded one component or another depending on the URL and a hash of routes for config. (I’d probably use SingleSPA [1] now. Same thing really.)

    We could deploy them separately since the build just ends up being another JS file somewhere that just gets included with a script tag at runtime. No version bumping! No big mega build!

    We started replacing the remaining “old” routes 1 by 1 with a “new” counter part. That was the easiest part, and went at a pace devs were comfortable with (fast enough) and business folk could tolerate. (modular enough to not HAVE to be done all at once)

    Last I checked, the angular 1.8 stuff is gone years ago. :)

    [1] https://single-spa.js.org/

  • react-sortable-hoc

    A set of higher-order components to turn any list into an animated, accessible and touch-friendly sortable list✌️

  • hotel

    🏩 A simple process manager for developers. Start apps from your browser and access them using local domains

  • beautiful-react-hooks

    🔥 A collection of beautiful and (hopefully) useful React hooks to speed-up your components and hooks development 🔥

    Project mention: Ultimate Guide & Resources to Enhancing Your ReactJS Skills || 16 GitHub repositories | dev.to | 2023-08-14

    Elevate your coding experience with these beautifully crafted hooks for a delightful development process.

  • Appwrite

    Appwrite - The open-source backend cloud platform. The open-source backend cloud platform for developing Web, Mobile, and Flutter applications. You can set up your backend faster with real-time APIs for authentication, databases, file storage, cloud functions, and much more!

  • all-of-frontend

    你想知道的前端内容都在这

  • rome

    :calendar: Customizable date (and time) picker. Opt-in UI, no jQuery!

  • blog

    Life is a moment :notebook_with_decorative_cover: (by MuYunyun)

  • SaltGUI

    A web interface for managing SaltStack based infrastructure.

    Project mention: Pricing and limitations | /r/saltstack | 2023-02-11

    Another good one I like which is more basic is Saltgui https://github.com/erwindon/SaltGUI

  • practical-front-end-projects

    Collection of practical front-end projects developed by pure JS, HTML, and CSS without any third-party libs and packages

  • quetre

    A libre front-end for Quora

    Project mention: How to browse Reddit, Youtube, Quora and twitter in this period of Bac exams without vpn | /r/algeria | 2023-06-12

    Use frontend alternitive websites: Reddit > https://libreddit.domain.glass/ | Youtube > https://docs.invidious.io/instances/ or https://piped.video | Quora > https://quetre.iket.me/ | Twitter > https://nitter.net/ | for linux users use these apps: Smplayer+smtube (youtube) available on Flathub and AUR or Freetube available Flathub and AUR | for android users: newpipe or libretube (youtube) | for more apps for linux, android and windows and more links visit this link for more information about frontend alternative websites watch Eric Murphy's video

  • meshery.io

    Site for Meshery, the cloud native manager

  • css-modules-typescript-loader

    Webpack loader to create TypeScript declarations for CSS Modules

  • interactor

    Front-End Code for Tracking Interactions and Conversions on Websites. (by greenstick)

  • epic-react-exercises

    Practical React exercises with detailed solutions.

  • bootstrap

    Tradução da documentação em Português Brasil do mais popular framework HTML, CSS, e JavaScript para desenvolvimento responsivo e projetos mobile first na web. (by bootstrapbrasil)

  • cocktails

    UI for browsing IBA cocktails (by mikeyhogarth)

  • color-tools

    Useful color tools for your next JavaScript project.

    Project mention: Useful color tools for your next JavaScript project. | /r/u_nextcss | 2023-02-20

  • RedditBadUIBattles

    My UI designs that I created for a Reddit subreddit named Bad UI Battles where the developers intentionally design bad UI .

  • SurveyJS

    A Non-Cloud Alternative to Google Forms that has it all.. SurveyJS JavaScript libraries allow you to easily set up a robust form management system fully integrated into your IT infrastructure where users can create and edit multiple dynamic JSON-based forms in a no-code form builder. Learn more now.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2023-08-23.

JavaScript front-end related posts

Index

What are some of the best open-source front-end projects in JavaScript? This list will help you:

Project Stars
1 Dragula 21,650
2 Bower 15,030
3 front-end-guide 14,992
4 single-spa 12,626
5 react-sortable-hoc 10,547
6 hotel 9,911
7 beautiful-react-hooks 7,106
8 all-of-frontend 5,197
9 rome 2,913
10 streamlink-twitch-gui 2,515
11 blog 1,545
12 SaltGUI 441
13 practical-front-end-projects 362
14 quetre 355
15 meshery.io 349
16 css-modules-typescript-loader 195
17 interactor 191
18 epic-react-exercises 149
19 bootstrap 120
20 cocktails 107
21 react-native-imaged-carousel-card 97
22 color-tools 83
23 RedditBadUIBattles 67

Sponsored
Write Clean JavaScript Code. Always.
Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.
www.sonarsource.com