{"id":21527900,"url":"https://github.com/uvacoder/time-to-have-more-fun","last_synced_at":"2026-04-09T17:49:56.684Z","repository":{"id":103087546,"uuid":"416163609","full_name":"Uvacoder/time-to-have-more-fun","owner":"Uvacoder","description":null,"archived":false,"fork":false,"pushed_at":"2021-10-12T03:05:24.000Z","size":679,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-24T06:08:51.757Z","etag":null,"topics":["cba","firebase","nextjs","react"],"latest_commit_sha":null,"homepage":"","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/Uvacoder.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":"2021-10-12T03:05:12.000Z","updated_at":"2021-11-26T07:58:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"752ba8e9-aa98-42f6-ab34-76509dfca1d5","html_url":"https://github.com/Uvacoder/time-to-have-more-fun","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/Uvacoder%2Ftime-to-have-more-fun","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Ftime-to-have-more-fun/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Ftime-to-have-more-fun/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Ftime-to-have-more-fun/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Uvacoder","download_url":"https://codeload.github.com/Uvacoder/time-to-have-more-fun/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244091376,"owners_count":20396611,"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":["cba","firebase","nextjs","react"],"created_at":"2024-11-24T01:50:37.564Z","updated_at":"2025-12-30T21:59:43.312Z","avatar_url":"https://github.com/Uvacoder.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Time to have more fun!\n\nA small web app to help us decide where to travel, built with [Next.js](https://nextjs.org/), [Firebase](https://firebase.google.com/), and [Tailwind CSS](https://tailwindcss.com/)\n\n## Set up\n\n1. `yarn`\n2. `npm install -g now`\n3. Set up [now secrets](https://zeit.co/docs/v2/serverless-functions/env-and-secrets) for Firebase env variables\n4. `now dev`\n\n---\n\nThis project was bootstrapped with [Create Next App](https://github.com/segmentio/create-next-app).\n\nFind the most recent version of this guide at [here](https://github.com/segmentio/create-next-app/blob/master/lib/templates/default/README.md). And check out [Next.js repo](https://github.com/zeit/next.js) for the most up-to-date info.\n\n## Table of Contents\n\n- [Time to have more fun!](#time-to-have-more-fun)\n  - [Set up](#set-up)\n  - [Table of Contents](#table-of-contents)\n  - [Questions? Feedback](#questions-feedback)\n  - [Folder Structure](#folder-structure)\n  - [Available Scripts](#available-scripts)\n    - [`npm run dev`](#npm-run-dev)\n    - [`npm run build`](#npm-run-build)\n    - [`npm run start`](#npm-run-start)\n  - [Using CSS](#using-css)\n  - [Adding Components](#adding-components)\n    - [`./components/simple.js`](#componentssimplejs)\n    - [`./components/complex.js`](#componentscomplexjs)\n  - [Fetching Data](#fetching-data)\n    - [`./pages/stars.js`](#pagesstarsjs)\n  - [Custom Server](#custom-server)\n  - [Syntax Highlighting](#syntax-highlighting)\n  - [Deploy to Now](#deploy-to-now)\n  - [Something Missing](#something-missing)\n\n## Questions? Feedback\n\nCheck out [Next.js FAQ \u0026 docs](https://github.com/zeit/next.js#faq) or [let us know](https://github.com/segmentio/create-next-app/issues) your feedback.\n\n## Folder Structure\n\nAfter creating an app, it should look something like:\n\n```md\n.\n├── README.md\n├── components\n│ ├── head.js\n│ └── nav.js\n├── next.config.js\n├── node_modules\n│ ├── [...]\n├── package.json\n├── pages\n│ └── index.js\n├── static\n│ └── favicon.ico\n└── yarn.lock\n```\n\nRouting in Next.js is based on the file system, so `./pages/index.js` maps to the `/` route and\n`./pages/about.js` would map to `/about`.\n\nThe `./public` directory maps to `/` in the `next` server, so you can put all your\nother static resources like images or compiled CSS in there.\n\nOut of the box, we get:\n\n- Automatic transpilation and bundling (with webpack and babel)\n- Hot code reloading\n- Server rendering and indexing of `./pages`\n- Static file serving. `./public/` is mapped to `/`\n\nRead more about [Next's Routing](https://github.com/zeit/next.js#routing)\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm run dev`\n\nRuns the app in the development mode.\u003cbr\u003e\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\u003cbr\u003e\nYou will also see any errors in the console.\n\n### `npm run build`\n\nBuilds the app for production to the `.next` folder.\u003cbr\u003e\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\n### `npm run start`\n\nStarts the application in production mode.\nThe application should be compiled with \\`next build\\` first.\n\nSee the section in Next docs about [deployment](https://github.com/zeit/next.js/wiki/Deployment) for more information.\n\n## Using CSS\n\n[`styled-jsx`](https://github.com/zeit/styled-jsx) is bundled with next to provide support for isolated scoped CSS. The aim is to support \"shadow CSS\" resembling of Web Components, which unfortunately [do not support server-rendering and are JS-only](https://github.com/w3c/webcomponents/issues/71).\n\n```jsx\nexport default () =\u003e (\n  \u003cdiv\u003e\n    Hello world\n    \u003cp\u003escoped!\u003c/p\u003e\n    \u003cstyle jsx\u003e{`\n      p {\n        color: blue;\n      }\n      div {\n        background: red;\n      }\n      @media (max-width: 600px) {\n        div {\n          background: blue;\n        }\n      }\n    `}\u003c/style\u003e\n  \u003c/div\u003e\n);\n```\n\nRead more about [Next's CSS features](https://github.com/zeit/next.js#css).\n\n## Adding Components\n\nWe recommend keeping React components in `./components` and they should look like:\n\n### `./components/simple.js`\n\n```jsx\nconst Simple = () =\u003e \u003cdiv\u003eSimple Component\u003c/div\u003e;\n\nexport default Simple; // don't forget to export default!\n```\n\n### `./components/complex.js`\n\n```jsx\nimport { Component } from 'react';\n\nclass Complex extends Component {\n  state = {\n    text: 'World',\n  };\n\n  render() {\n    const { text } = this.state;\n    return \u003cdiv\u003eHello {text}\u003c/div\u003e;\n  }\n}\n\nexport default Complex; // don't forget to export default!\n```\n\n## Fetching Data\n\nYou can fetch data in `pages` components using `getInitialProps` like this:\n\n### `./pages/stars.js`\n\n```jsx\nconst Page = props =\u003e \u003cdiv\u003eNext stars: {props.stars}\u003c/div\u003e;\n\nPage.getInitialProps = async ({ req }) =\u003e {\n  const res = await fetch('https://api.github.com/repos/zeit/next.js');\n  const json = await res.json();\n  const stars = json.stargazers_count;\n  return { stars };\n};\n\nexport default Page;\n```\n\nFor the initial page load, `getInitialProps` will execute on the server only. `getInitialProps` will only be executed on the client when navigating to a different route via the `Link` component or using the routing APIs.\n\n_Note: `getInitialProps` can **not** be used in children components. Only in `pages`._\n\nRead more about [fetching data and the component lifecycle](https://github.com/zeit/next.js#fetching-data-and-component-lifecycle)\n\n## Custom Server\n\nWant to start a new app with a custom server? Run `create-next-app --example customer-server custom-app`\n\nTypically you start your next server with `next start`. It's possible, however, to start a server 100% programmatically in order to customize routes, use route patterns, etc\n\nThis example makes `/a` resolve to `./pages/b`, and `/b` resolve to `./pages/a`:\n\n```jsx\nconst { createServer } = require('http');\nconst { parse } = require('url');\nconst next = require('next');\n\nconst dev = process.env.NODE_ENV !== 'production';\nconst app = next({ dev });\nconst handle = app.getRequestHandler();\n\napp.prepare().then(() =\u003e {\n  createServer((req, res) =\u003e {\n    // Be sure to pass `true` as the second argument to `url.parse`.\n    // This tells it to parse the query portion of the URL.\n    const parsedUrl = parse(req.url, true);\n    const { pathname, query } = parsedUrl;\n\n    if (pathname === '/a') {\n      app.render(req, res, '/b', query);\n    } else if (pathname === '/b') {\n      app.render(req, res, '/a', query);\n    } else {\n      handle(req, res, parsedUrl);\n    }\n  }).listen(3000, err =\u003e {\n    if (err) throw err;\n    console.log('\u003e Ready on http://localhost:3000');\n  });\n});\n```\n\nThen, change your `start` script to `NODE_ENV=production node server.js`.\n\nRead more about [custom server and routing](https://github.com/zeit/next.js#custom-server-and-routing)\n\n## Syntax Highlighting\n\nTo configure the syntax highlighting in your favorite text editor, head to the [relevant Babel documentation page](https://babeljs.io/docs/editors) and follow the instructions. Some of the most popular editors are covered.\n\n## Deploy to Now\n\n[now](https://zeit.co/now) offers a zero-configuration single-command deployment.\n\n1. Install the `now` command-line tool either via the recommended [desktop tool](https://zeit.co/download) or via node with `npm install -g now`.\n\n2. Run `now` from your project directory. You will see a **now.sh** URL in your output like this:\n\n   ```\n   \u003e Ready! https://your-project-dirname-tpspyhtdtk.now.sh (copied to clipboard)\n   ```\n\n   Paste that URL into your browser when the build is complete, and you will see your deployed app.\n\nYou can find more details about [`now` here](https://zeit.co/now).\n\n## Something Missing\n\nIf you have ideas for how we could improve this readme or the project in general, [let us know](https://github.com/segmentio/create-next-app/issues) or [contribute some!](https://github.com/segmentio/create-next-app/edit/master/lib/templates/default/README.md)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuvacoder%2Ftime-to-have-more-fun","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fuvacoder%2Ftime-to-have-more-fun","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuvacoder%2Ftime-to-have-more-fun/lists"}