Next.js对手来了！Remix正式宣布开源

近日，Remix宣布关闭付费订阅模式，正式开源。

[[436889]]

Remix是一个新的全栈式JavaScript  框架，它摆脱了静态网站的生成，并且在其他方面做了一些与我们常用的其他框架不同的事情。此前Remix并非开源项目，其个人和企业许可证的售价分别为每年250美元和每年1000美元。

如今宣布开源之后，可以说是Next.js最强劲的对手了，二者之间独具特色之外，还有许多相似之处，不知道接下去用户会如何选择。

Remix 作为一个框架，具有以下功能特性：

• 文件系统路由

• 路由布局嵌套

• 自动拆分代码

• 数据驱动的元标签

• 内置数据加载

• 零配置构建

• React Refresh

下面一起来看看Remix的常规使用方法

初始化一个新的Reminx项目：

复制

npx create-remix@latest  # choose Remix App Server  cd [whatever you named the project]  npm run dev

• 1.

• 2.

• 3.

• 4.

• 5.

• 6.

• 7.

接下来，我们将创建一个新的路径以在“/posts” URL  处呈现。首先在Layout组件中找到并在链接到“Home”之后，添加一个到“/posts”的新链接。

添加一个链接到帖子 app/root.tsx

复制

<li>   <Link to="/posts">Posts</Link> </li>

• 1.

• 2.

• 3.

返回浏览器，你应该会在标题栏看到新的链接，然后单击它，你就会看到一个404页面，现在开始创建路径：

首先在里面创建一个新文件app/routes/posts/index.tsx

复制

mkdir app/routes/posts  touch app/routes/posts/index.tsx

• 1.

• 2.

• 3.

最后创建帖子组件

复制

export default function Posts() {   return (     <div>       <h1>Posts</h1>     </div>   ); }

• 1.

• 2.

• 3.

• 4.

• 5.

• 6.

• 7.

可能需要刷新浏览器才能看到我们新的、基本的帖子路径。

目前，Remix已经登上了Github热榜第一，标星 5.1K，累计分支  227(Github地址：https://github.com/remix-run/remix)

感兴趣的伙伴们不要错过了，Remix官网地址：https://remix.run/