{"id":13762096,"url":"https://github.com/daily-demos/fullscreen-prebuilt-ui","last_synced_at":"2025-05-10T14:31:16.617Z","repository":{"id":46646862,"uuid":"313446046","full_name":"daily-demos/fullscreen-prebuilt-ui","owner":"daily-demos","description":"a demo showcasing the prebuilt UI and a serverless function to create rooms","archived":false,"fork":false,"pushed_at":"2023-04-20T15:16:24.000Z","size":2304,"stargazers_count":6,"open_issues_count":1,"forks_count":7,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-02-12T22:51:45.186Z","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/daily-demos.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":"CODE_OF_CONDUCT.md","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":"2020-11-16T22:46:25.000Z","updated_at":"2024-08-03T14:05:12.906Z","dependencies_parsed_at":"2024-08-03T14:05:06.205Z","dependency_job_id":"2ada08c6-8c18-4308-863d-d7ac247594f9","html_url":"https://github.com/daily-demos/fullscreen-prebuilt-ui","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/daily-demos%2Ffullscreen-prebuilt-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/daily-demos%2Ffullscreen-prebuilt-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/daily-demos%2Ffullscreen-prebuilt-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/daily-demos%2Ffullscreen-prebuilt-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/daily-demos","download_url":"https://codeload.github.com/daily-demos/fullscreen-prebuilt-ui/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253428270,"owners_count":21906881,"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-08-03T14:00:34.734Z","updated_at":"2025-05-10T14:31:16.029Z","avatar_url":"https://github.com/daily-demos.png","language":"JavaScript","funding_links":[],"categories":["Demos"],"sub_categories":[],"readme":"# Daily fullscreen prebuilt UI demo\n\nThis demo highlights [Daily's prebuilt UI](https://www.daily.co/blog/prebuilt-ui/), and how it can be expanded fullscreen in a website or app.\n\nIt works really well with our [chrome extension demo](https://github.com/daily-demos/screenshare-chrome-ext). Although it works totally fine as a standalone app as well.\n\nCheck out a live version of the demo [here](https://fullscreen-prebuilt-ui.netlify.app/).\n\n## Prerequisites\n\n- [Sign up for a Daily account](https://dashboard.daily.co/signup) and get API key from [https://dashboard.daily.co/developers](https://dashboard.daily.co/developers)\n\n### Optional\n\n- Click the Netlify deploy button below and follow the instructions\n\n[![Deploy with Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/daily-demos/fullscreen-prebuilt-ui)\n\n- Use the API key from above\n\n- Install the [chrome extension](https://github.com/daily-demos/screenshare-chrome-ext) and add the url of your new Netlify site.\n\n## How the demo works\n\nThe frontend part of this demo renders our prebuilt UI in a fullscreen iframe and looks for two query parameters:\n\n- `room` - the url of the call\n- `screenshare` - whether to automatically start a screenshare\n\nThis means if you visit `https://your-netlify-site.netlify.app/?room=https://mydomain.daily.co/roomname\u0026screenshare=true` it will join a meeting at the room url specified and prompt you to start a screenshare.\n\nIt also contains an API proxy that is meant to be deployed to Netlify that will create rooms for you. This allows a demo room to be automatically created whenever you load the app without a `room` parameter in the url. This also allows the chrome extension to create a unique room whenever you click \"Create and launch call\".\n\n## Running locally\n\n1. Install dependencies: `npm i`.\n2. Start dev server: `npm run dev`.\n\nNext, you'll have two ways to connect to a room. You can use Netlify to access the Daily REST API: see the Netlify CLI instructions below. Using the Netlify proxy will allow you to create rooms on the fly.\n\nIf you prefer to test with a hardcoded room, make sure to [create a room via the Daily dashboard](https://help.daily.co/en/articles/4202139-creating-and-viewing-rooms). Then run `npm run dev`, and add your room's link to the room query parameter in your localhost URL: `http://localhost:8080/?room=https://mydomain.daily.co/my-room`\n\nThis will join the `my-room` room in your local environment.\n\n## Running using Netlify CLI\n\nIf you want access to the Daily REST API (using the proxy as specified in `netlify.toml`) as well as a more robust local dev environment, please do the following (in this project's directory):\n\n1. Deploy to your Netlify account\n   [![Deploy with Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/daily-demos/fullscreen-prebuilt-ui)\n\n2. Install the Netlify CLI `npm i -g netlify-cli`\n3. Login to your account `netlify login`\n4. Rename `sample.env` to `.env` and add your API key\n5. Start the dev server `netlify dev`\n\n\u003e Note: If the API proxy isn't working locally you may need to run `netlify build` first. This will put API key in the `netlify.toml` file, so make sure you don't commit this change.\n\n## Contributing and feedback\n\nLet us know how experimenting with this demo goes! Feel free to reach out to us any time at `help@daily.co`.\n\n## What's next\n\nTry customizing the landing page you see after leaving a meeting, or add support for other query parameters!","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdaily-demos%2Ffullscreen-prebuilt-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdaily-demos%2Ffullscreen-prebuilt-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdaily-demos%2Ffullscreen-prebuilt-ui/lists"}