Catamist, a simple Steam clone. A demo and discussion for implementing Figma design into React components

Overview

Catamist

Catamist is a very simple Steam clone. The name comes from Catalyst + Catamyst + Mist (Steam synonym).

A demo and discussion for implementing UI and UX design from Figma into React components.

App

Designs

Videos

In English:

  1. Coming Soon (Maybe)

In Indonesian:

  1. Figma to React https://youtu.be/mdebhZ76Iic
  2. Form Data https://youtu.be/kYh_SSRygmE
  3. Backend API https://youtube.com/channel/UCmOBswBENyNAP10eZ_xCHSQ
You might also like...
The UI design language and React library for Conversational UI
The UI design language and React library for Conversational UI

The UI design language and React library for Conversational UI Website:https://chatui.io English | 简体中文 Features 😎 Best Practices: The best practice

⚛️A beautiful and modern React design system.
⚛️A beautiful and modern React design system.

Shards React is a free, beautiful and modern React UI kit based on Shards. Documentation & Demo • Official Page Getting Started Getting started with S

A frontend Framework for building B2B applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design
A frontend Framework for building B2B applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design

react-admin A frontend Framework for building data-driven applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Materi

A modern, comprehensive, flexible design system and React UI library
A modern, comprehensive, flexible design system and React UI library

A modern, comprehensive, flexible design system and UI library. Quickly build beautiful React apps.

An open-source UI component library for building high-quality, accessible design systems and web apps
An open-source UI component library for building high-quality, accessible design systems and web apps

An open-source UI component library for building high-quality, accessible design systems and web apps

React 17 & Bootstrap 5 & Material Design 2.0 UI KIT
React 17 & Bootstrap 5 & Material Design 2.0 UI KIT

React 17 & Bootstrap 5 & Material Design 2.0 UI KIT

ClearX is an alternative way to Redux and MobX to maintain the application state and provides a simple interface to bind it to UI components

ClearX is an alternative way to Redux and MobX to maintain the application state and provides a simple interface to bind it to UI components. It has utilities to set or get deep properties of nested data using paths.

dataminr-react-components - Collection of reusable React Components and utility functions.

react-components A collection of reusable React components with their own Flux lifecycle. What's inside react-components? Table Component From a simpl

Fluent UI web represents a collection of utilities, React components, and web components for building web applications.

Fluent UI Web Fluent UI web represents a collection of utilities, React components, and web components for building web applications. This repo is hom

Owner
M Haidar Hanif
😎 Helping people in web, design, software, career, and life. Ideas, UI, UX, documentation, HTML, CSS, JavaScript, TypeScript, Node, React, Remix, Next, GraphQL
M Haidar Hanif
Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

Material-UI Quickly build beautiful React apps. Material-UI is a simple and customizable component library to build faster, beautiful, and more access

Material-UI 81.4k Sep 22, 2022
React components and demo for the Tabler UI theme.

Update - June 2019: Version 2 Alpha now available on NPM: npm install [email protected] yarn add [email protected] Check out the latest progress and

Tabler 2.1k Sep 24, 2022
An opinionated UI Workbench featuring tools like react, styled components, typescript, webpack, jest and storybook all bundled into an easy to use interface

An opinionated UI Workbench featuring tools like react, styled components, typescript, webpack, jest and storybook all bundled into an easy to use interface

Alex Wright 17 Dec 18, 2021
Inject React components into 3rd-party sites using ShadowDOM with ease (and without troubles with styles)! Particularly useful in browser extensions

Inject React components into 3rd-party sites using ShadowDOM with ease (and without troubles with styles)! Particularly useful in browser extensions

Oleh 19 Sep 12, 2022
PyScript-React integrates PyScript library into react components

PyScript-React integrates PyScript library into react components. Making it easier to use inside your react projects ??

null 63 Sep 1, 2022
A React declarative component for converting HTML strings into React components🚀

React HTML String ?? A React declarative component for converting HTML strings into React components. Avoids the use of dangerouslySetInnerHTML and co

Mo'men Sherif 9 Sep 20, 2022
A comprehensive React UI components library based on the Arco Design system.

A comprehensive React UI components library based on the Arco Design system.

null 3.4k Sep 30, 2022
Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System

Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit System.

Timeless 196 Aug 11, 2022
A simple collection of widgets built with simple React components

React Widgets This is a simple collection of widgets built with simple React components. This repo is displayed for the code, not a finished project.

Duncan Murchison 1 Jul 21, 2022
🌈 A UI Design Language and React UI library

Ant Design An enterprise-class UI design language and React UI library. English | Português | 简体中文 ✨ Features ?? Enterprise-class UI designed for web

Ant Design Team 82.1k Oct 1, 2022