![Create React App Officially Deprecated Amid React 19 Compatibility Issues](https://cdn.sanity.io/images/cgdhsj6q/production/04fa08cf844d798abc0e1a6391c129363cc7e2ab-1024x1024.webp?w=400&fit=max&auto=format)
Security News
Create React App Officially Deprecated Amid React 19 Compatibility Issues
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
@remix-run/node
Advanced tools
@remix-run/node is a package that provides utilities for building server-side applications with Remix. It includes tools for handling HTTP requests and responses, managing sessions, and working with cookies, among other things.
Handling HTTP Requests and Responses
This feature allows you to create a request handler for your Remix application. The `createRequestHandler` function sets up the necessary context for handling HTTP requests and responses.
const { createRequestHandler } = require('@remix-run/node');
const handler = createRequestHandler({
getLoadContext() {
return { some: 'context' };
}
});
module.exports = handler;
Managing Sessions
This feature provides a way to manage user sessions using cookies. The `createCookieSessionStorage` function sets up session storage with specified cookie options.
const { createCookieSessionStorage } = require('@remix-run/node');
const sessionStorage = createCookieSessionStorage({
cookie: {
name: '__session',
secrets: ['s3cr3t'],
secure: true,
sameSite: 'lax',
path: '/',
httpOnly: true
}
});
module.exports = sessionStorage;
Working with Cookies
This feature allows you to create and manage cookies. The `createCookie` function sets up a cookie with specified options like max age and HTTP-only flag.
const { createCookie } = require('@remix-run/node');
const myCookie = createCookie('myCookie', {
maxAge: 60 * 60 * 24,
httpOnly: true
});
module.exports = myCookie;
Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. Unlike @remix-run/node, which is specifically designed for use with Remix, Express is a general-purpose framework that can be used for a wide variety of web applications.
Koa is a new web framework designed by the team behind Express, which aims to be a smaller, more expressive, and more robust foundation for web applications and APIs. Koa uses async functions to help you write cleaner, more readable code. While @remix-run/node is tailored for Remix applications, Koa is a more general-purpose framework.
Hapi is a rich framework for building applications and services. It enables developers to focus on writing reusable application logic instead of spending time building infrastructure. Hapi is more configuration-driven compared to @remix-run/node, which is more convention-driven and integrated with Remix.
Remix is a web framework that helps you build better websites with React.
To get started, open a new shell and run:
npx create-remix@latest
Then follow the prompts you see in your terminal.
For more information about Remix, visit remix.run!
v2.7.0
Date: 2024-02-20
We're excited to announce that support for Vite is now stable in Remix 2.7.0
! Ever since the initial unstable release of Remix Vite, we’ve been hard at work refining and extending it over the past few months with help from all of our early adopters and community contributors. This also means that Vite-only features such as SPA Mode, Server Bundles, and basename
support are now officially stable as well 😊.
For more information, check out the blog post and the Vite docs.
Layout
ExportWe've found that it's super common to create your own component in your root route to hold the shared layout/app shell between your Component
/ErrorBoundary
/HydrateFallback
. This is so common (and can also cause some minor edge-case issues such as a FOUC on hydration) that we've incorporated this as a first-class API in 2.7.0
.
You can now export an optional Layout
component from your root route which will be provided your route component, ErrorBoundary, or HydrateFallback as it's children
. For more information, please see the Layout
docs and the RFC.
React Router has long supported a basename
config that allows you to serve your app within a subpath such as http://localhost/myapp/*
without having to include the /myapp
segment in all of your route paths. This was originally omitted from Remix because v1 nested folders file-convention made it pretty easy to put your route files in a routes/myapp/
folder, giving you the same functionality. There has also been an open proposal from the community to add this functionality.
Two things have since changed that made us reconsider the lack of basename
support:
myapp.
compared to the nested folder conventionbase
config which is often (and easily) confused with the concept of a React Router basename
(when in reality it's more aligned with the old Remix publicPath
config)In 2.7.0
we've added support for a basename
in the Vite plugin config. For more information, please check out the basename
docs.
Note: This is a Vite-only feature and is not available via the esbuild
compiler.
⚠️ This is a breaking change for projects relying on Cloudflare support from the unstable Vite plugin
The Cloudflare preset (unstable_cloudflarePreset
) as been removed and replaced with a new Vite plugin:
import {
unstable_vitePlugin as remix,
- unstable_cloudflarePreset as cloudflare,
+ cloudflareDevProxyVitePlugin as remixCloudflareDevProxy,
} from "@remix-run/dev";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [
+ remixCloudflareDevProxy(),
+ remix(),
- remix({
- presets: [cloudflare()],
- }),
],
- ssr: {
- resolve: {
- externalConditions: ["workerd", "worker"],
- },
- },
});
A few notes on the new plugin:
remixCloudflareDevProxy
must come before the remix
plugin so that it can override Vite's dev server middleware to be compatible with Cloudflare's proxied environmentremixCloudflareDevProxy
can set ssr.resolve.externalConditions
to be workerd
-compatible for youremixCloudflareDevProxy
accepts a getLoadContext
function that replaces the old getRemixDevLoadContext
nightly
version that required getBindingsProxy
or getPlatformProxy
, that is no longer requiredgetBindingsProxy
or getPlatformProxy
should now be passed to remixCloudflareDevProxy
instead@remix-run/react
- Allow an optional Layout
export from the root route (#8709)@remix-run/cloudflare-pages
- Make getLoadContext
optional for Cloudflare Pages (#8701)
(context) => ({ env: context })
, which is what we used to have in all the templates@remix-run/dev
- Vite: Cloudflare Proxy as a Vite plugin (#8749)
@remix-run/dev
- Vite: Add a new basename
option to the Vite plugin, allowing users to set the internal React Router basename
in order to to serve their applications underneath a subpath (#8145)@remix-run/dev
- Vite: Stabilize the Remix Vite plugin, Cloudflare preset, and all related types by removing all unstable_
/ Unstable_
prefixes (#8713)
@remix-run/dev
- Vite: Stabilize "SPA Mode" by renaming the Remix vite plugin config from unstable_ssr -> ssr
(#8692)@remix-run/express
- Use req.originalUrl
instead of req.url
so that Remix sees the full URL (#8145)
@remix-run/react
- Fix a bug with SPA mode when the root route had no children (#8747)@remix-run/server-runtime
- Add a more specific error if a user returns a defer
response from a resource route (#8726)@remix-run/dev
- Always prepend DOCTYPE
in SPA mode entry.server.tsx
, can opt out via remix reveal (#8725)@remix-run/dev
- Fix build issue in SPA mode when using a basename
(#8720)@remix-run/dev
- Fix type error in Remix config for synchronous routes
function (#8745)@remix-run/dev
- Vite: Fix issue where client route file requests fail if search params have been parsed and serialized before reaching the Remix Vite plugin (#8740)@remix-run/dev
- Vite: Validate that the MDX Rollup plugin, if present, is placed before Remix in Vite config (#8690)@remix-run/dev
- Vite: Fix issue resolving critical CSS during development when the current working directory differs from the project root (#8752)@remix-run/dev
- Vite: Require version 5.1.0
to support .css?url
imports (#8723)@remix-run/dev
- Vite: Support Vite 5.1.0
's .css?url
imports (#8684)@remix-run/dev
- Vite: Enable use of vite preview
to preview Remix SPA applications (#8624)
npm run start
has been renamed to npm run preview
which uses vite preview
instead of a standalone HTTP server such as http-server
or serv-cli
@remix-run/dev
- Vite: Remove the ability to pass publicPath
as an option to the Remix vite plugin (#8145)
publicPath
base
config so we now set the Remix publicPath
from the Vite base
config@remix-run/dev
- Vite: Enable HMR for .md
and .mdx
files (#8711)@remix-run/dev
- Vite: reliably detect non-root routes in Windows (#8806)@remix-run/dev
- Vite: Pass remixUserConfig
to preset remixConfig
hook (#8797)@remix-run/dev
- Vite: Ensure CSS file URLs that are only referenced in the server build are available on the client (#8796)@remix-run/dev
- Vite: fix server exports dead-code elimination for routes outside of app directory (#8795)create-remix
@remix-run/architect
@remix-run/cloudflare
@remix-run/cloudflare-pages
@remix-run/cloudflare-workers
@remix-run/css-bundle
@remix-run/deno
@remix-run/dev
@remix-run/eslint-config
@remix-run/express
@remix-run/node
@remix-run/react
@remix-run/serve
@remix-run/server-runtime
@remix-run/testing
Full Changelog: v2.6.0...v2.7.0
FAQs
Node.js platform abstractions for Remix
The npm package @remix-run/node receives a total of 9,595 weekly downloads. As such, @remix-run/node popularity was classified as popular.
We found that @remix-run/node demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
Security News
The Linux Foundation is warning open source developers that compliance with global sanctions is mandatory, highlighting legal risks and restrictions on contributions.