Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more! Learn more →
Top 23 TypeScript Gatsby Projects
-
This is a real concern. I've worked on some Yarn projects where I sometimes forget and accidentally run npm. Although these package managers (I'll call them PMs for short) are interoperable to some degree, there are important differences between these tools, so you should know what you're getting into. Even in seemingly simple projects, results can vary. Here are two reports of things working with one PM, but not another. Moreso, running install once is very different from continuous concurrent use, where you're adding and removing packages and more.
-
Check out Builder.io’s GitHub repository for more details about its features and community.
-
SurveyJS
Extensible JavaScript Form Builder Libraries. SurveyJS is a set of four fully customizable JS libraries that allow you to create, easily modify, and run multiple web forms in any web app, while retaining all sensitive data on your own servers.
-
actions-gh-pages
GitHub Actions for GitHub Pages 🚀 Deploy static files and publish your site easily. Static-Site-Generators-friendly.
Check out the GitHub action you can use for deploying to GitHub pages: https://github.com/peaceiris/actions-gh-pages.
-
Take a look at Use hooks libraries for examples of code that you may want to have portability with (this is they typescript one because its the one I've used)
One of the simplest examples is "useToggle" which just sets a state variable to true or false. Not hard to write in a class component but it's still stuff that you may end up writing a lot.
A lot of similar ones are click and event handlers that need to be cleaned up after the component is unmounted.
useIsMounted is one I use a lot too to ensure I'm not trying to write state on an API callback once a component is unmounted.
You could add each of these to a class with an hoc and end up with withToggle(withIsMounted(withUseMediaEvent(MyComponent))) but that tends to be a bit of a mess.
-
Project mention: Is there a nocode ui builder which lets you use professional backend resources? | reddit.com/r/nocode | 2023-02-15
I think Plasmic satisfies all of your requirements: https://www.plasmic.app/
-
meli
Platform for deploying static sites and frontend applications easily. Automatic SSL, deploy previews, reverse proxy, and more.
Project mention: Is there a CC-like license with a timed exclusivity clause? | reddit.com/r/creativecommons | 2023-01-29 -
gatsby-starter-lumen
A constantly evolving and thoughtful architecture for creating static blogs with Gatsby.
Until now, my personal website was using a Gatsby with a beautiful template named Lumen. Since I don't want to re-write my website every year to follow the latest trend in React world and since I couldn't change much without learning the framework, I've decided to switch to something else. Many static site generators needs several days or weeks to be mastered, so I went for the simpler solution to be able to build the first version of my website in a weekend: 11ty.
-
Appwrite
Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!
-
Reactime 6.0: State Debugger for React
Chrome developer tool for time travel debugging and performance monitoring in React applications.
Thanks a lot! Link to github: https://github.com/open-source-labs/reactime
-
gatsby-themes
Get high-quality and customizable Gatsby themes to quickly bootstrap your website! Choose from many professionally created and impressive designs with a wide variety of features and customization options.
-
-
gatsby-starter-portfolio-cara
Playful and Colorful One-Page portfolio featuring Parallax effects and animations. Especially designers and/or photographers will love this theme! Built with MDX and Theme UI.
Project mention: How to write code for a design that has svg object in background | reddit.com/r/react | 2023-01-03I would probably do it like Leno arts did with this project https://github.com/LekoArts/gatsby-starter-portfolio-cara
-
gatsby-starter-minimal-blog
Typography driven, feature-rich blogging theme with minimal aesthetics. Includes tags/categories support and extensive features for code blocks such as live preview, line numbers, and line highlighting.
-
elements
Build beautiful, interactive API Docs with embeddable React or Web Components, powered by OpenAPI and Markdown. (by stoplightio)
Complete, up-to-date, and exhaustive documentation that can be generated with Stoplight Elements
-
gatsby-starter-mate
An accessible and fast portfolio starter for Gatsby integrated with Contentful CMS
Project mention: Developer Showcase Spotlight: Low-code examples of building blogs | dev.to | 2022-10-06I’d been searching the web for a suitable template, and eventually I found the Mate portfolio starter by software engineer Ema Suriano. This is a beautiful single page site with a customizable and responsive design regardless of whether you access it on a desktop, smartphone, or magic mirror. If you end up using this template yourself, be sure to buy them a coffee.
-
gatsby-starter-portfolio-jodie
Image-heavy photography portfolio with colorful accents & customizable pages. Includes adaptive image grids powered by CSS grid and automatic image integration into projects.
-
-
gatsby-starter-ts
TypeScript starter for Gatsby. No plugins and styling. Exactly the necessary to start. Ready for Gatsby 5 🔥
Project mention: How To Integrate Gatsby with Shopify using Shopify Custom Apps | dev.to | 2022-05-31You can also use a starter like [gatsby-starter-ts](https://github.com/jpedroschmitz/gatsby-starter-ts)
-
-
-
Project mention: Retrieving values from gitlab environment variables to be used in gatsby-*.js files | reddit.com/r/gatsbyjs | 2022-06-07
You should just be able to read the value from process.env.API_TOKEN. Here's an example which reads several values from environment variables.
-
I mentioned in another reply that the issue with images was within rich text, using the Portal text package. As I out described in my issue, it's not an issue of docs. GatsbyImageData is not output in the graphql, just a _ref which appears to be the filename without any path or domain. GatsbyImageData is used to process the image so if a content editor throws in a 2000px wide image, I can use that output to make a smaller image.
-
Project mention: Show HN: I spent 2 years building Tablane as a 17-year-old | news.ycombinator.com | 2023-01-06
-
There are some plugins/libraries that may help instrumenting the Gatsby code for internationalization. In this article we will use a plugin based on the famous i18n framework i18next, respectively its great extension for React.js - react-i18next. The Gatsby plugin we're using is gatsby-plugin-react-i18next created by Dmitriy Nevzorov.
-
Sonar
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.
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-03-16.
TypeScript Gatsby related posts
- ReacTime Feedback Request
- Gitignore template generator
- 5 Small and Hidden React libraries you should already be using
- ✨ Gitignored: A free open-source gitignore template generator written in NextJS ✨
- “Experience”
- Give your blog superpowers with MDX in a Next.js project
- Prismic CMS Limitations/Bugs?
-
A note from our sponsor - Appwrite
appwrite.io | 1 Apr 2023
Index
What are some of the best open-source Gatsby projects in TypeScript? This list will help you:
| Project | Stars | |
|---|---|---|
| 1 | docz | 23,157 |
| 2 | builder | 4,746 |
| 3 | actions-gh-pages | 3,776 |
| 4 | usehooks-ts | 3,363 |
| 5 | plasmic | 2,416 |
| 6 | meli | 2,292 |
| 7 | gatsby-starter-lumen | 1,918 |
| 8 | Reactime 6.0: State Debugger for React | 1,802 |
| 9 | gatsby-themes | 1,793 |
| 10 | react-google-maps-api | 1,428 |
| 11 | gatsby-starter-portfolio-cara | 1,338 |
| 12 | gatsby-starter-minimal-blog | 1,062 |
| 13 | elements | 941 |
| 14 | gatsby-starter-mate | 535 |
| 15 | gatsby-starter-portfolio-jodie | 321 |
| 16 | prismic-gatsby | 310 |
| 17 | gatsby-starter-ts | 292 |
| 18 | gatsby-gh-pages-action | 287 |
| 19 | midway | 259 |
| 20 | gatsby-plugin-s3 | 207 |
| 21 | gatsby-source-sanity | 196 |
| 22 | posthog.com | 146 |
| 23 | gatsby-plugin-react-i18next | 107 |
Access the most powerful time series database as a service
Ingest, store, & analyze all types of time series data in a fully-managed, purpose-built database. Keep data forever with low-cost storage and superior data compression.
www.influxdata.com