#typescript #accessibility #design_system #react #react_components #wai_aria

Base UI is a library of unstyled UI components that helps you build accessible user interfaces. It was created by the same people who made Radix, Floating UI, and Material UI. You can start using it by checking out the documentation, which includes a quick start guide. If you find any issues or want to improve it, you can contribute by following the contributing guide. For support, you can join the community on Discord or follow updates on X and Bluesky. This tool is beneficial because it makes creating user-friendly and accessible interfaces easier, and it has a supportive community to help you along the way.

https://github.com/mui/base-ui

#typescript #android #android_app #bangumi #design #expo #ios #ios_app #mobx #moe #react #react_native

This app, called Bangumi, is a third-party client for the Bangumi website, which helps you manage and track your progress on anime, manga, music, Japanese dramas, games, and more. It works on both iOS and Android devices and has over 100 pages designed for mobile use, covering almost all the features of the website.

The app includes basic functions like managing your watch list, viewing character details, timelines, posts, and user spaces. It also has extended features such as syncing data from other sites like Bilibili and Douban, stable data display using a CDN, photo walls, AI recommendations, and more.

Using this app benefits you by providing a convenient and comprehensive way to manage your media consumption on the go, with a user-friendly interface and additional features to enhance your experience.

https://github.com/czy0729/Bangumi

#javascript #design_system #hacktoberfest #javascript #react #scss

Carbon Design System is an open-source design system created by IBM, based on the IBM Design Language. It includes working code, design tools, human interface guidelines, and a community of contributors. You can use it for various technologies like React, Angular, Vue, and Svelte. The system offers components, styles, icons, and other design elements that are consistent and accessible. It is licensed under Apache-2.0, making it free to use and contribute to. This helps you build consistent and professional-looking applications quickly and efficiently.

https://github.com/carbon-design-system/carbon

#javascript #art #creative_coding #design #education #graphics #html #javascript #learning #p5js #processing #sound

p5.js is a free and open-source JavaScript library for creative coding, designed to be accessible and inclusive. It allows users to create interactive, audio-visual, experimental, and generative works for the web. The library is built on principles of accessibility, inclusivity, community, and joy, making it suitable for artists, designers, educators, beginners, and everyone else.

Key benefits include p5.js prioritizes accessibility, ensuring it's usable by a wide range of people.
- **Community Support** The library comes with comprehensive documentation and visual examples, along with tutorials and a web editor where you can start coding right away.
- **Customizable Tools**: Users can extend p5.js with many community-created libraries, adding different capabilities to their projects.

Overall, p5.js encourages iterative and exploratory coding for creative expression, fostering a welcoming environment for all voices.

https://github.com/processing/p5.js

#other #architecture #awesome #awesome_list #backend #big_data #computer_science #design_patterns #devops #distributed_systems #interview #interview_practice #interview_questions #lists #machine_learning #programming #resources #scalability #system #system_design #web_development

This resource provides a comprehensive guide to building scalable, reliable, and performant large-scale systems. Here are the key benefits It offers detailed articles and case studies from prominent engineers on how to design systems that can handle heavy loads and perform well for both single users and millions of users.
- **System Design Interviews** It covers how to scale teams effectively, focusing on increasing team output and value rather than just growing the team size.
- **Community Contributions** The resource covers a wide range of topics including scalability, availability, stability, performance, intelligence, architecture, and more, providing a holistic view of system engineering.

Overall, this guide is invaluable for anyone looking to build or maintain large-scale systems efficiently.

https://github.com/binhnguyennus/awesome-scalability

#typescript #browser #design #devtool #electron #figma #frontend #hacktoberfest #local_first #low_code #nextjs #no_code #react #tailwindcss #typescript #ui #vitejs #webflow

Onlook is a tool for designers that lets you make live edits to your website or web app directly in the browser. It works with React and TailwindCSS, allowing you to customize your design and control your code easily. You can download the app from onlook.com or build it from source. Onlook helps you edit elements by right-clicking them to find their exact location in the code, making your design process faster and more efficient. Stay updated with new features through their newsletter or social media channels. This tool is especially beneficial because it streamlines your design and coding workflow, saving you time and effort.

https://github.com/onlook-dev/onlook

#clojure #clojure #clojurescript #design #prototyping #ui #ux_design #ux_experience

Penpot is a free, open-source design tool that helps designers and developers work together smoothly. It allows designers to create stunning designs and interactive prototypes, while developers can access ready-to-use code in SVG, CSS, and HTML. Penpot is web-based, works on any browser, and can be self-hosted. It features a plugin system, real-time collaboration, and integrations with other tools. The latest version includes a CSS Grid Layout feature, a new UI, and improved performance. Joining the Penpot community allows you to contribute, ask questions, and share your designs and ideas. This makes the design and coding process easier and faster for everyone involved.

https://github.com/penpot/penpot

#typescript #ant_design #antd #design_systems #react #typescript #ui_kit #ui_library

Ant Design is a powerful tool for building web applications. It offers a set of high-quality React components, enterprise-class UI design, and support for multiple languages. You can easily install it using `npm` or `yarn`. It supports modern browsers, server-side rendering, and Electron. The library is written in TypeScript, which makes it predictable and stable. You can also customize the theme using CSS-in-JS. This makes it easier to create consistent and professional-looking interfaces quickly, saving you time and effort in your development process.

https://github.com/ant-design/ant-design

#javascript #css_framework #design #design_system #javascript #javascript_framework #markdown_flavour #nuejs

Nue is a new web framework that focuses on using web standards to make web development simpler and more efficient. It helps you build apps with much less code, making them faster and smaller. For example, Nue apps can be smaller than a single React button. It also supports using languages like Rust for better performance. This means developers can create faster and more efficient applications with less effort, which is beneficial for both developers and users who want quick and responsive web experiences.

https://github.com/nuejs/nue

#svelte #component #component_library #components #css #css_components #css_framework #daisyui #design_pattern #design_system #design_systems #postcss #svelte #tailwind #tailwind_css #tailwindcss #ui_design #ui_framework #ui_kit #ui_library #ui_pattern

daisyUI is a popular, free, and open-source component library for Tailwind CSS. It helps you build faster by providing useful class names for common UI elements like cards and calendars. This means you write less code and can focus on designing your interface more efficiently. daisyUI is also very customizable and works well with Next.js, adding no extra JavaScript to your projects, which keeps them fast and efficient. Overall, using daisyUI simplifies your development process and makes your projects more maintainable.

https://github.com/saadeghi/daisyui

#rust #2d_graphics #art #compositor #design #graphic_design #graphics_editor #image_generation #image_manipulation #image_processing #node_editor #node_graph #photo_editing #photo_editor #procedural #procedural_art #procedural_drawing #svg_editor #vector_editor

Graphite is a free, open-source 2D graphics editor that combines vector and raster tools with a unique hybrid workflow using layers and nodes. It lets you create detailed vector art and designs with nondestructive editing, meaning you can change your work anytime without losing quality. The node-based system offers powerful, flexible control like visual programming, while the layer system keeps things simple and familiar. This makes it easy to create complex graphics, animations, and effects all in one tool. Graphite is still evolving but aims to be a versatile, all-in-one creative platform accessible to everyone, helping you unleash your artistic potential efficiently[1][2][4].

https://github.com/GraphiteEditor/Graphite

#vue #canvas_editor #design #design_editor #editor #fabricjs #image_editor #poster #svg_editor #vue_fabric

You can use a powerful open-source image editor built with fabric.js and Vue that lets you easily design images by dragging and dropping. It supports many features like importing PSD and JSON files, exporting PNG and SVG, layers, gradients, custom fonts, cropping, filters, and more. You can customize fonts, templates, right-click menus, and shortcuts, and extend it with plugins. This editor is lightweight and simple to use, making it great for quick image editing without complex tools. It also offers a paid version with full backend support and batch image generation, helping you save time and reduce development effort.

https://github.com/ikuaitu/vue-fabric-editor

#typescript #design #docs #gatsby #handbook #posthog #tailwindcss

PostHog.com is the website and code repository for PostHog, an open-source product analytics platform that helps you track user behavior, test new features, and improve your product all in one place. You can run the website locally by installing Node and Yarn, cloning the repo, and starting the development server. The site includes product docs, blogs, tutorials, and tools like job listings and pricing calculators. This setup lets you customize and contribute to the site easily, making it useful if you want to understand or improve PostHog’s platform or help develop its content and features. It supports collaboration and learning for developers and product teams.

https://github.com/PostHog/posthog.com