A starter project that includes theme switching functionality with Stitches CSS-in-JS and Remix SSR.

Overview

Welcome to Remix!

Development

From your terminal:

npm run dev

This starts your app in development mode, rebuilding assets on file changes.

Deployment

First, build your app for production:

npm run build

Then run the app in production mode:

npm start

Now you'll need to pick a host to deploy it to.

DIY

If you're familiar with deploying node applications, the built-in Remix app server is production-ready.

Make sure to deploy the output of remix build

  • build/
  • public/build/

Using a Template

When you ran npx create-remix@latest there were a few choices for hosting. You can run that again to create a new project, then copy over your app/ folder to the new project that's pre-configured for your target server.

cd ..
# create a new project, and pick a pre-configured host
npx create-remix@latest
cd my-new-remix-app
# remove the new project's app (not the old one!)
rm -rf app
# copy your app over
cp -R ../my-old-remix-app/app app
You might also like...

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.

Gatsby Starter Portfolio: Cara Playful and Colorful One-Page portfolio featuring Parallax effects and animations. Using the Gatsby Theme @lekoarts/gat

Dec 24, 2021

Logseq-craft-theme - Craft Theme for Logseq

Logseq-craft-theme - Craft Theme for Logseq

Craft for Logseq Almost all creativity requires purposeful play. A Craft insprir

Oct 26, 2022

Remix starter kit with Tailwind CSS family of libraries: Headless UI, Radix UI, VechaiUI, daisyUI, and more

Remix starter kit with Tailwind CSS family of libraries: Headless UI, Radix UI, VechaiUI, daisyUI, and more

Remix Tailwind Starter Kit Remix starter kit with Tailwind CSS v3 family of libraries. Example demo to combine the best Tailwind-related ecosystem suc

Dec 18, 2022

⏪ Rewinds – Remix Tailwind Starter Kit with Tailwind CSS, Headless UI, Radix UI, and more

⏪ Rewinds – Remix Tailwind Starter Kit with Tailwind CSS, Headless UI, Radix UI, and more

⏪ Rewinds – Remix Tailwind Starter Kit Rewinds is a Remix starter kit with Tailwind CSS v3 family of libraries. This is an example demo to combine the

Dec 24, 2022

GitHub starter project link: https://github.com/buildspace/waveportal-starter-project

Running React on Repl.it React is a popular JavaScript library for building user interfaces. Vite is a blazing fast frontend build tool that includes

Jun 5, 2022

Remix starter for a Contentful blog (template) project

Remix starter for a Contentful blog (template) project

Contentful Remix Starter Blog Create a Remix blog powered by Contentful. Based on the contentful gatsby starter blog repo. Getting started Get the sou

Dec 15, 2022

Remix enables you to build fantastic user experiences for the web and feel happy with the code that got you there. In this workshop, we'll look at some more advanced use cases when building Remix applications.

💿 Advanced Remix Workshop Remix enables you to build fantastic user experiences for the web and feel happy with the code that got you there. In this

Dec 9, 2022

Remix enables you to build fantastic user experiences for the web and feel happy with the code that got you there. Get a jumpstart on Remix with this workshop.

💿 Remix Fundamentals Build Better websites with Remix Remix enables you to build fantastic user experiences for the web and feel happy with the code

Dec 25, 2022

simple-remix-blog is a blog template built using Remix and TailwindCSS. Create your own blog in just a few minutes!

simple-remix-blog is a blog template built using Remix and TailwindCSS. Create your own blog in just a few minutes!

simple-remix-blog is a blog template built using remix.run and TailwindCSS. It supports markdown and MDX for the blog posts. You can clone it and star

Dec 8, 2022
Comments
  • Unable to get correct initial theme?

    Unable to get correct initial theme?

    Hey Ross,

    Were you able to get automatic detection of the users theme from the OS to work with this approach? I'm trying to apply your technique whilst deploying to Cloudflare Pages, so I'm not sure if that makes any difference or if there's something I should take into account because of this.

    I've been able to get the theme swapping to work using the button.

    opened by syeef 1
  • FART on very first request?

    FART on very first request?

    Hi, I would like to ask if this solution you don’t have this problem that when a user comes to your site for the very first time, then he didn’t see FART. The sam should be the case using incognito mode on every new request.

    I have very similar solution to yours and I can’t get rid of that problem. On Remix discussion page I was told it can’t really work on that initial request.

    If I switch to Tailwind and CSS approach, then I get another error. This time regarding class missmatch between server and client.

    Such a simple feature like color scheme is so far the most advanced one I’ve worked on for my hobby project.

    opened by kwiat1990 1
Owner
Ross Moody
Product designer by trade, frontend engineer at heart.
Ross Moody
My XFCE dotties - The GTK theme as well as the kvantume theme used here are forks of the Matcha GTK/kvantum theme

DOTFILES OF MY XFCE SETUP The GTK theme as well as the kvantume theme used here

Mehedi Rahman Mahi 201 Dec 31, 2022
Theme Redone is a custom WordPress theme starter/framework with its own Gutenberg blocks solution and a CLI that speeds up the block creation process.

Theme Redone The Framework for Developing Custom WordPress Themes with its own Gutenberg Blocks creation solution. Theme Redone is a custom WordPress

null 103 Dec 30, 2022
A demonstration app for Fresh that shows how to use SSR, the islands functionality, APIs and more

Fresh Pokemon Demo Code This is a demonstration app for Fresh that shows how to use SSR, the islands functionality, APIs and more. You do need to conn

Jack Herrington 23 Dec 18, 2022
This project is a boilerplate for Next and TypeScript projects. This template was built with Vite, TypeScript and Stitches.

Awesome Template Stitches — NextJS, TypeScript, Stitches and Design Tokens Summary About this template Avaliale scripts Other scripts available Main t

Diego Silva 14 Dec 29, 2022
✨ My portfolio built with TypeScript, Next.js, Stitches and GraphQL.

Technologies | How to Use | Cloning or Forking ?? Technologies This project was developed with the following technologies: TypeScript Next.js GraphQL

Matheus Pires 9 Nov 10, 2022
A launcher for quickly & easily switching server destinations.

GrassClipper Grasscutter launcher for easily switching between Official and Private servers Download Here! *Note: some translations are outdated, so i

null 520 Jan 6, 2023
Awesome books app is a basic website that allows users to add/remove books from a list. It is a single page app (SPA) which allow switching to different pages of the app without page load. Built with JavaScript.

Awesome Books ES6 In this project, I build a basic website that allows users to add/remove books from a list. using ES6 syntax and make it more organi

Abdulhamid 11 Jul 1, 2022
Page switching like a Boss. Inspired by jQuery mobile

Roadcrew.js / Roadcrew.dart =========================== Roadcrew.js is a simple JavaScript snippet which allows "page transitions" like in jQuery mob

Christian Grobmeier 49 Aug 20, 2018
Javascript library for switching fixed elements on scroll through sections. Like Midnight.js, but without jQuery

Library for Switching Fixed Elements on Scroll Sometimes designers create complex logic and fix parts of the interface. Also they colour page sections

Vladimir Lysov 38 Sep 19, 2022