Top 23 TypeScript styled-component Projects
-
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
I'm not sure if this is a response to my comment about styled-components. If so, styled-components is something specific. https://styled-components.com/ (Emotions library also has this as an option too). It's not just a wrapper. And you wouldn't be able to use it in conjunction with bootstrap classes unless you took additional steps in the setup. But nevermind about this. It's not necessary, I was just taking a guess as to what code you were referring to.
-
-
OPS
OPS - Build and Run Open Source Unikernels. Quickly and easily build and deploy open source unikernels in tens of seconds. Deploy in any language to any cloud.
-
Project mention: Anyone have any experience with the React95 library? | reddit.com/r/reactjs | 2021-10-14
I am trying to use this library in a new project and I am running into some issues when using the icons.
-
react-boilerplate-cra-template
:fire: Setup Create React App with React Boilerplate. Highly scalable & Best DX & Performance Focused & Best practices.
Another great option is React-Boilerplate-Typescript: https://github.com/react-boilerplate/react-boilerplate-cra-template Very opinionated, however.
-
Project mention: [R] Any Canadians on here know how to scrape off CBC Gem? | reddit.com/r/DHExchange | 2021-08-28
There are browser extensions such as this one to download streams like that easily.
-
typescript-plugin-styled-components
TypeScript transformer for improving the debugging experience of styled-components
In this particular case, there is an alternative to make it work without babel, but:
-
twin.examples
Packed with examples for different frameworks, this repo helps you get started with twin a whole lot faster.
Project mention: How to set up _document.js with twin.macro + Google Analytics ? | reddit.com/r/nextjs | 2021-09-24well, this is exactly how it's set up in the twin.macro example repo with next.js, and it is working perfectly fine?
-
Scout APM
Less time debugging, more time building. Scout APM allows you to find and fix performance issues with no hassle. Now with error monitoring and external services monitoring, Scout is a developer's best friend when it comes to application development.
-
Project mention: What's a good library for react components? | reddit.com/r/learnreactjs | 2021-04-04
Some I had in mind (Let me know if you recommend any in particular from these): - https://github.com/paljs/ui - https://v2.grommet.io/ - https://github.com/balena-io-modules/rendition - https://github.com/hackclub/design-system - https://demos.creative-tim.com/argon-design-system-react/#/documentation/quick-start - https://www.buffetjs.io/ - https://mineral-ui.com/
-
-
stacks-wallet-web
Hiro Wallet is a browser extension for managing your digital assets and connecting to apps built with the Stacks blockchain.
Project mention: Hardware wallet support for the browser extension Hiro wallet | reddit.com/r/stacks | 2022-01-11I know that there is an open github issue https://github.com/hirosystems/stacks-wallet-web/issues/951 regarding ledger support for the extension wallet.
-
css-in-js-media
:art: Deal with responsive design simply when use CSS-in-JS (styled-components,emotion.js)
Project mention: Deal with responsive design simply when use CSS-in-JS | news.ycombinator.com | 2021-05-18 -
Project mention: I made a game based on JoJo's Bizarre Adventure manga. Links in comments! | reddit.com/r/FreeCodeCamp | 2021-12-07
Game: https://jojo-cards.netlify.app
-
springload/frontend-starter-kit - The building blocks of front-end development at Springload
-
react-native-template
An opinionated template to bootstrap your next React Native app with all the time-wasting packages you need to have.
Project mention: Help me create the best React Native template to bootstrap your next app | reddit.com/r/reactnative | 2021-04-03 -
react-native-whirlwind
Whirlwind is a utility-first styling framework specifically designed for React Native. It is heavily inspired by Tachyons and Tailwind CSS and uses low-level building blocks for rapidly building custom designs.
Project mention: React Native Whirlwind - Tailwind CSS like styling for React Native | reddit.com/r/SideProject | 2021-09-09And of course, it's available on GitHub: https://github.com/arabold/react-native-whirlwind
-
Project mention: Me and my friend created a peer to peer webRTC based file transfer website | reddit.com/r/reactjs | 2021-10-17
Frontend source code: https://github.com/thephilomaths/sendight-frontend
-
I recently published Chic UI (React UI Component Library) on NPM.
-
Brought to you by the Stacks Foundation, Boom, & Friedger Pool with special thanks to our community partner DeSpread, ICOPantera, and Bukon.
-
As part of their hiring process, some development companies set up academies where they invite both developers and non-developers to attend a series of workshops. It's a great alternative to bootcamps because they are usually free, with no strings attached. You just have to show that you have the right attitude and hunger for learning. The fact that I attended STRV React Nights in 2019 definitely played an important role in eventually getting hired.
-
react-prime
A starter kit to create comprehensive React apps with React-Query and Styled-Components.
Depends on the type. Anything local I do in a types.ts file in the same folder as where I will use the type. Anything "global" I import/export from a single file and when you want to use any of these types you can import them like so. Makes it really easy to use and see what types are available and which are meant to be global.
-
Project mention: 13 Ultimate UI/UX website inspiration for Designers and Developers | dev.to | 2021-06-02
Portfolio of Ronnie Feng built with TypeScript and is Open Source on Github. The animation are sick on his portfolio, he has used GSAP🤯. Visit -> Ronnie Feng Portfolio
-
Project mention: Turbo-props: Tiny wrapper around styled-components to turbo charge your workflow | news.ycombinator.com | 2021-09-16
-
ESPIDA
a HYBRID dynamic + static Gatsby e-commerce site using Shopify to manage our product data and orders!
Project mention: Another project using TypeScript, Gatsby, and Shopify | reddit.com/r/gatsbyjs | 2022-01-11Github: https://github.com/melboudali/ESPIDA
TypeScript styled-components related posts
- How often should I comment HTML?
- 🖋Adding Fonts in Next.js (local fonts along with styled components)
- Making an AeroPress Tracking App
- Reusable components (e.g. button) - one Button.tsx that takes props or multiple such as PrimaryButton, PrimaryButtonWithIcon etc?
- Random letters go brrr
- Responsive CSS border radius with the Fab Four technique
- SCSS nesting doesn't work
Index
What are some of the best open-source styled-component projects in TypeScript? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | styled-components | 35,734 |
| 2 | reactour | 2,827 |
| 3 | React95 | 1,795 |
| 4 | react-boilerplate-cra-template | 1,261 |
| 5 | hls-downloader | 811 |
| 6 | typescript-plugin-styled-components | 392 |
| 7 | twin.examples | 267 |
| 8 | ui | 156 |
| 9 | react-functional-select | 149 |
| 10 | stacks-wallet-web | 130 |
| 11 | css-in-js-media | 121 |
| 12 | jojo-cards | 113 |
| 13 | frontend-starter-kit | 111 |
| 14 | react-native-template | 107 |
| 15 | react-native-whirlwind | 83 |
| 16 | sendight-frontend | 52 |
| 17 | chic-ui | 37 |
| 18 | connect | 37 |
| 19 | react-nights-2019 | 32 |
| 20 | react-prime | 32 |
| 21 | Portfolio | 9 |
| 22 | turbo-props | 9 |
| 23 | ESPIDA | 7 |
Are you hiring? Post a new remote job listing for free.
