https://github.com/michaelcurrin/react-deno-quickstart

Starter template for a React app built on Deno - including docs and CI ⚛️ 🦕 📦
https://github.com/michaelcurrin/react-deno-quickstart

deno gh-pages-site quickstart react starter template

Last synced: 8 months ago
JSON representation

Starter template for a React app built on Deno - including docs and CI ⚛️ 🦕 📦

• Host: GitHub
• URL: https://github.com/michaelcurrin/react-deno-quickstart
• Owner: MichaelCurrin
• License: mit
• Created: 2021-02-17T20:08:12.000Z (over 5 years ago)
• Default Branch: main
• Last Pushed: 2021-07-22T08:06:55.000Z (almost 5 years ago)
• Last Synced: 2025-04-12T00:41:44.414Z (about 1 year ago)
• Topics: deno, gh-pages-site, quickstart, react, starter, template
• Language: TypeScript
• Homepage: https://michaelcurrin.github.io/react-deno-quickstart/
• Size: 2.07 MB
• Stars: 3
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# React Deno Quickstart ⚛️ 🦕 📦

> Starter template for a React app built on Deno - including docs and CI

[![Deno CI](https://github.com/MichaelCurrin/react-deno-quickstart/workflows/Deno%20CI/badge.svg)](https://github.com/MichaelCurrin/react-deno-quickstart/actions?query=workflow:"Deno+CI" "GitHub Actions CI")

[![GitHub tag](https://img.shields.io/github/tag/MichaelCurrin/react-deno-quickstart?include_prereleases=&sort=semver)](https://github.com/MichaelCurrin/react-deno-quickstart/releases/)

[![License](https://img.shields.io/badge/License-MIT-blue)](#license)

[![Made with Deno](https://img.shields.io/badge/Deno->=1.7-blue?logo=deno&logoColor=white)](https://deno.land)

[![Made with React](https://img.shields.io/badge/React-17.0.1-blue?logo=react&logoColor=white)](https://www.npmjs.com/package/react)

[![Hosted with GH Pages](https://img.shields.io/badge/Hosted_with-GitHub_Pages-blue?logo=github&logoColor=white)](https://pages.github.com/)

[![Made with GH Actions](https://img.shields.io/badge/CI-GitHub_Actions-blue?logo=github-actions&logoColor=white)](https://github.com/features/actions)



    

        

    

    

        

    



## Preview

This template project uses **Deno** to build a **React** app and output static assets. No Node.js or NPM used there. 

The app gets deployed with CI using GH Actions. Then it is served as a static [GitHub Pages][] site.

This is what the demo site looks like:



    

        

    








[![View site - GH Pages](https://img.shields.io/badge/View_site-GH_Pages-blue?style=for-the-badge)](https://michaelcurrin.github.io/react-deno-quickstart/)

[![Use this template](https://img.shields.io/badge/Generate-Use_this_template-2ea44f?style=for-the-badge)](https://github.com/MichaelCurrin/react-deno-quickstart/generate)



[GitHub Pages]: https://pages.github.com/

## Sample usage

Start a dev server:

```sh

$ make serve

```

Create a bundled minified JS file of all your app code and depenendencies.

```sh

$ make build

```

The output JS file then can be loaded in the browser using a `index.html` page. Which means you can host your rendered React application as SPA web app anywhere, such as on GitHub Pages (like this project) or Netlify.

## About this template

### Overview

- Provides a basic **template** project so you can quickly setup your own React + Deno project, without much Deno experience.

- Uses **React version 17**.

- Uses **Deno** and **make** to handle dev and production build tasks. 

    - No more Node and NPM.

    - TypeScript, JSX, formatting and linting are all supported by Deno - no packages needed.

- Deploys as a **GitHub Pages** static site using GitHub Actions. No manual deploy steps or server management needed.

See the [Template notes](/docs/template-notes/) section of the docs for help on how to use this project and to find out what is included.

Start building with React and Deno:

- [![Use this template](https://img.shields.io/badge/Generate-Use_this_template-2ea44f)](https://github.com/MichaelCurrin/react-deno-quickstart/generate)

Want to stick with Node.js or compare how this React/Deno app looks compared to React/Node app? See my Node-based template:

- [![MichaelCurrin - react-quickstart](https://img.shields.io/static/v1?label=MichaelCurrin&message=react-quickstart&color=blue&logo=github)](https://github.com/MichaelCurrin/react-quickstart)

## Documentation



[![view - Documentation](https://img.shields.io/badge/view-Documentation-blue?style=for-the-badge)](/docs/)



## License

Released under [MIT](/LICENSE) by [@MichaelCurrin](https://github.com/MichaelCurrin).