{"id":16582709,"url":"https://github.com/nodejh/now-test-nextjs","last_synced_at":"2025-12-02T21:08:14.172Z","repository":{"id":90786539,"uuid":"175992308","full_name":"nodejh/now-test-nextjs","owner":"nodejh","description":null,"archived":false,"fork":false,"pushed_at":"2019-03-16T15:53:13.000Z","size":2,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-16T12:52:32.158Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nodejh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-03-16T15:53:06.000Z","updated_at":"2019-03-16T15:53:14.000Z","dependencies_parsed_at":null,"dependency_job_id":"dab5d30f-555f-4203-97ec-51b64f5fb126","html_url":"https://github.com/nodejh/now-test-nextjs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nodejh%2Fnow-test-nextjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nodejh%2Fnow-test-nextjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nodejh%2Fnow-test-nextjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nodejh%2Fnow-test-nextjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nodejh","download_url":"https://codeload.github.com/nodejh/now-test-nextjs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242138788,"owners_count":20078007,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-11T22:33:49.290Z","updated_at":"2025-12-02T21:08:09.125Z","avatar_url":"https://github.com/nodejh.png","language":"JavaScript","readme":"# Next.js\n\nIn this example we will be deploying a simple \"Hello World\" example with Next.js.\n\n### Getting started with Next.js\n\n- Create a `pages` folder with an `index.js` file with the following code:\n\n```jsx\nimport Link from \"next/link\";\nimport Header from \"../components/header\";\n\nexport default () =\u003e (\n  \u003cmain\u003e\n    \u003cHeader /\u003e\n    \u003csection\u003e\n      \u003cLink href=\"/about\"\u003e\n        \u003ca\u003eGo to About Me\u003c/a\u003e\n      \u003c/Link\u003e\n    \u003c/section\u003e\n  \u003c/main\u003e\n);\n```\n\n- Now lets create an `about.js` file inside the `pages` folder with the following code:\n\n```jsx\nimport { Component } from \"react\";\nimport Link from \"next/link\";\nimport Header from \"../components/header\";\n\nclass AboutPage extends Component {\n  static getInitialProps() {\n    const isServer = typeof window === \"undefined\";\n    return { isServer };\n  }\n\n  render() {\n    return (\n      \u003cmain\u003e\n        \u003cHeader /\u003e\n        \u003csection\u003e\n          \u003cp\u003e\n            This is another page of the SSR example, you accessed it{\" \"}\n            \u003cstrong\u003e{this.props.isServer ? \"server\" : \"client\"} side\u003c/strong\u003e.\n          \u003c/p\u003e\n          \u003cp\u003e\n            You can reload to see how the page change.\n          \u003c/p\u003e\n          \u003cLink href=\"/\"\u003e\n            \u003ca\u003eGo to Home\u003c/a\u003e\n          \u003c/Link\u003e\n        \u003c/section\u003e\n      \u003c/main\u003e\n    );\n  }\n}\n\nexport default AboutPage;\n```\n\n- As you might noticed we have a component that is shared by both `index.js` and `about.js` files, let's create that one now. Create a folder named `components` with a file named `header.js` in it and add the following code:\n\n```jsx\nexport default () =\u003e (\n  \u003cheader\u003e\n    \u003ch1\u003eNext.js Example\u003c/h1\u003e\n  \u003c/header\u003e\n);\n```\n\n- Finally in order for Next.js to be deployed we could either have a `next.config.js` or a `package.json`, for this example we are just going to create a `next.config.js` with the following code:\n\n```js\nmodule.exports = {\n  target: 'serverless'\n}\n```\n\n### Deploy with Now\n\nFirst we need to create a `now.json` configuration file to instruct Now how to build the project.\n\nFor this example we will be using our newest version [Now 2.0](https://zeit.co/now).\n\nBy adding the `version` key to the `now.json` file, we can specify which Now Platform version to use.\n\nWe also need to define each builders we would like to use. [Builders](https://zeit.co/docs/v2/deployments/builders/overview/) are modules that take a deployment's source and return an output, consisting of [either static files or dynamic Lambdas](https://zeit.co/docs/v2/deployments/builds/#sources-and-outputs).\n\nIn this case we are going to use `@now/next` to build and deploy our Next.js application selecting the `next.config.js` as our entry point. We will also define a name for our project (optional).\n\n```json\n{\n    \"version\": 2,\n    \"name\": \"nextjs\",\n    \"builds\": [\n        { \"src\": \"next.config.js\", \"use\": \"@now/next\" }\n    ]\n}\n```\n\nVisit our [documentation](https://zeit.co/docs/v2/deployments/configuration) for more information on the `now.json` configuration file.\n\nWe are now ready to deploy the app.\n\n```\nnow\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnodejh%2Fnow-test-nextjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnodejh%2Fnow-test-nextjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnodejh%2Fnow-test-nextjs/lists"}