hackernews react graphql
1.0.0
该项目是使用React和GraphQL重写的Hacker News的克隆。它旨在成为一个示例或样板，以帮助您使用准备就绪的技术来构建项目。
现场演示
反应 - （UI框架）
GraphQL-（Web Data API）
Apollo-（GraphQL客户端/服务器）
下一个 - （路由，SSR，热模块重新加载，代码分配，构建工具使用WebPack）
打字稿 - （静态类型）
webpack-（模块Bundler）
PostCSS-（CSS处理）
node.js-（Web服务器）
Express-（Web App Server）
护照 - （身份验证）
ESLINT-（编码最佳实践/代码突出显示）
开玩笑 - （测试）
Docker-（容器部署）
可选 - 纱线或PNPM软件包管理器 - （更好的依赖项）
前端
react ）typescript ）@apollo/client ）next ）服务器
node ＆ express ）apollo-server ）apollo-server-express ）apollo-server-express ）apollo-server-express ）passport ）next ）next ）next ）docker ）开发/测试
next ）jest ）apollo-server-express ）pnpm / yarn ）eslint ）
server.ts是入口点。它使用Express并将请求传递到下一步。接下来，SSR使用Apollo Helper的getServerSideProps()挂钩呈现页面。因此，该应用在客户端或服务器上提出GraphQL请求。
当客户端加载页面时，它会从任何<Link href="/">中预订下一个页面代码。当客户端导航到下一页时，只需要对一个GraphQl查询进行渲染。伟大的！
查看更多：next.js，apollo graphql客户端
GraphQl：Apollo或GraphQl Docs的GraphQl-Tools
每个网页在pages中都有一个反应组件。服务器代码在server中。在客户端或服务器上运行的共享代码在src中。不要从server或src中的pages导入，以避免在错误的环境中运行代码。
项目root包含配置文件，例如打字稿，babel，eslint，docker，flow，npm，yarn，git。
您可以使用一个命令下载并运行仓库来统治所有内容：
git clone https://github.com/clintonwoo/hackernews-react-graphql.git && cd hackernews-react-graphql && npm install && npm start
以开发模式运行该应用程序的完整特征包括热模块重新加载：
npm install
npm start
在生产模式下运行：
npm run build:prod && npm run start:prod
该项目以默认设置（ /src/config.ts ）为单方面。您可以在项目root中包含一个.env文件以配置设置（这是“ dotenv ” NPM软件包）。 .env文件包含在.gitignore中。
npm test
该项目使用开玩笑，可以对React组件进行快照测试。每当更改组件时，请使用npm test -- -u或npx jest --updateSnapshot更新快照。
npm run build:prod ：nextJS应用带有输入点server.ts ，使用node.js/express。使用Typescript编译器来构建SRC。
或者
npm run build-docker木材码头容器：使用Dockerfile构建Docker容器。
NextJ可以使我们建立一个功能强大的静态网站，但是您需要考虑是否需要服务器端渲染。
npm run build-static-website ：构建静态网站到/build/static 。使用静态Web服务器，例如。 nginx/github页面。
欢迎拉动请求。提出想法，对话或反馈的问题。
★明星这个项目之后，请在Twitter上关注@clintondannolfo。
