nextjs-starter, 一个 Next.js的启动项目,

分享于 

5分钟阅读

GitHub

  繁體 雙語
A starter project that shows how to put together a website with Next.js
  • 源代码名称:nextjs-starter
  • 源代码网址:http://www.github.com/iaincollins/nextjs-starter
  • nextjs-starter源代码文档
  • nextjs-starter源代码下载
  • Git URL:
    git://www.github.com/iaincollins/nextjs-starter.git
    Git Clone代码到本地:
    git clone http://www.github.com/iaincollins/nextjs-starter
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/iaincollins/nextjs-starter
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    

    XO code style

    Next.js-起始项目

    这是一个使用 Next.js. 进行React的起始项目

    它包括以下功能:

    • 通过电子邮件,Facebook,Twitter 和 Google+ ( 使用Express和 Passport ) 进行认证。
    • 基本帐户管理( 更新详细信息,链接/取消链接帐户,delete 帐户)。
    • 仅支持安全HTTP的会话支持。
    • CSRF令牌。
    • Bootstrap 4和 Reactstrap ( 用于响应的Bootstrap 组件)。
    • SCSS,实时重新加载。
    • 带有 Ionicons icon 字体并显示如何捆绑其他CSS和字体。

    你可以在https://nextjs-starter.now.sh 中看到现场演示

    Next.js 是一个框架,它使得创建通用的web应用程序变得更加容易。 使用 Next.js, React页面自动呈现在客户端和服务器端,不需要设置dependancies和 of。

    这是一个起始项目,提供如何使用 Next.js 和 Express ( 面向 node.js的流行web服务器框架),带有 SCSS,Bootstrap,reactstrap (。Boostrap 4用于响应),Ionicons icon 集以及如何使用 Passport ( 一种通用的node.js 认证) 同时支持oAuth和Email的身份验证系统。

    这个项目是为了让创建通用应用程序变得更加容易。 你被邀请作为参考或者复制它,并将它的用作你自己项目的基础。 欢迎对改进这里项目做出贡献。

    在开发模式下运行

    要开始,只需克隆存储库并运行 npm install && npm run dev :

    
    git clone https://github.com/iaincollins/nextjs-starter.git
    
    
    npm install
    
    
    npm run dev
    
    
    
    

    注意:如果你运行 Windows 运行安装--noptional标志( 例如。 npm install --no-optional ),它将跳过安装 fsevents。

    在生产中构建和部署

    如果要在生产中运行这里站点,则应安装模块,然后使用 npm run build 构建站点并使用 npm start 运行该站点:

    
    npm install
    
    
    npm run build
    
    
    npm start
    
    
    
    

    你每次更改站点时都应再次运行 npm run build

    注意:如果你已经在端口 80上运行web服务器( 比如。 Macs通常在端口 80上运行 Apache webserver你仍然可以在启动( 比如 ) 时将不同的端口作为环境变量传递到生产模式来启动这个示例。 PORT=3000 npm start )。

    配置

    如果配置. env 文件( 只需复制 . env. 默认值'。env'然后填写这些选项),可以配置一系列选项。

    如果你想做的话,看看 AUTHENTICATION.md 如何设置 oAuth。 它建议你从 Twitter 开始,因为它是最容易工作的。

    使用部署到云中的

    要部署 zeit的云平台 now just只需安装它,克隆该存储库并在工作目录中运行 now:

    
    npm install -g now
    
    
    now
    
    
    
    

    如果配置. env 文件 now,则在使用-E选项部署时,将在部署时包括它:

     
    now -E
    
    
    
     

    如果要让本地 .env 文件包含本地开发变量,并在生产或者登台中使用不同的varaibles,则可以创建其他. env 文件,并在部署时告诉 now 使用特定文件。

    例如:

    
    now -E production.env
    
    
    
    

    运行测试

    使用JavaScript样式 linter 执行样式格式,在运行 npm test 时调用。

    反映了 Next.js的大多数示例,在 package.json 中我们配置了'xo'以告诉它这个项目使用了空间( 非选项卡) 和 JSX。

    xo需要全局安装:

     
    install -g xo
    
    
    
     

    你可以通过运行 xo 或者运行 npm test 来检查 linting。

    注意:目前没有特定的应用程序测试,除了样式检查之外。


    STA  proj  auth  A Star  NEXT  
    相关文章