![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
翻译
Seven-后会有七
写点程序,赚点小钱……偶尔旅游,摄影,打网球,热爱美食-减肥中
展开
-
官网《Next.js —— 起步》
一、开始目前对于创建一个JavaScript单页应用是个挑战这个事实已经不再是一个秘密。幸运的是,总有一些简单易用的东西能够帮助你更快的构建应用‘创建应用-https://github.com/facebook/create-react-app’是个非常棒的例子!即便如此,在你创建一个一般的应用来说依旧有较高的学习曲线。所以,我们需要一个简单且可定制的东西。想一想,我们是如何用...翻译 2018-10-16 15:58:24 · 2685 阅读 · 0 评论 -
官网《Next.js —— 在两个页面间导航》
现在我们已经知道如何创建一个Next.js的app并且运行它,这个简单的app只有一个单一页面,但是我们可以增加许多我们想要增加的页面。比如我们可以依据下面内容来创建一个‘关于’页面到‘page/about.js’:然后我们可以通过http://localhost:3000/about来访问这个页面。export default () => ( <div> &l...翻译 2019-01-28 11:48:43 · 1190 阅读 · 0 评论 -
官网《Next.js —— 共享组件的使用》
我们知道Next.js是以页面去展现的,我们通过导出一个React 组件来创建一个页面,然后把页面放进'page'的路径下,于是就有了基于文件名的固定的url。由于导出的页面其实是JavaScript的模块,所以当然也可以导入其它JavaScript组件到页面中。这是一个任何其它JavaScript框架所期待的特性在这节课中,我们将会创建一个公共的Header组件,并且将它置于多个页面...翻译 2019-01-29 15:02:41 · 1416 阅读 · 0 评论 -
官网《Next.js —— 创建动态页面》
现在我们知道如何在Next.js 应用中创建多个页面。为了创建一个页面,我们必须要在硬盘中创建一个真实的文件。然而,在实际的项目中,我们需要创建动态页面去显示动态内容。对于Next.js 我们有很多途径来实现。我们首先用“查询字符”来创建一个动态页面,我们要创建一个简单的“博客”应用,这个页面在首页有很多帖子列表。(如图)当你点击某个帖子的标题,你就能够在这个页面看到特定的帖子的内容。...翻译 2019-03-05 17:52:04 · 1455 阅读 · 0 评论 -
官网《Next.js —— 用'路由伪装'清理URLs》
在之前的课程中,我们学习到如何用查询字符创建动态页面。用那种方式,一个博客的请求链接会是这样:http://localhost:3000/post?title=Hello%20Next.js但是这个URL看起来不是很友好,你觉得如果像 http://localhost:3000/p/hello-nextjs 这样的链接怎么样?这很棒对吧?这就是我们要在这节课中要做的。安装...翻译 2019-03-14 14:12:46 · 786 阅读 · 0 评论 -
官网《Next.js —— 服务端对“整洁”路由的支持》
在前面一节中,我们学习了如何为我们的应用创建一个“整洁”的URLs,基本上我们可以得到如‘http://localhost:3000/p/my-blog-post’这样的url。但是,这只能在我们的客户端运行。当我们重新加载这个页面时,它会返回一个404页面。这是因为实际上根本没有一个叫“p/my-blog-post”的页面目录。运用Next.js cunstom server API...翻译 2019-07-02 10:39:18 · 638 阅读 · 0 评论 -
官网《Next.js —— 为页面获取数据》
现在我们知道如何创建一个像样的Next.js应用了,并且也充分使用了Next.js路由API。在实践中,我们通常要从远程数据源获取数据。Next.js具备标准的获取数据的API,那就是成为同步函数的'getInitialProps'.用这个函数,我们就能从远程获取数据,并且以属性的方式传递回页面。我们能同时在客户端和服务端写入这个函数,所以,自然而然可以在两端使用。在这节课中,通过使用"get...翻译 2019-07-05 10:06:01 · 2504 阅读 · 0 评论