renovate[bot] beeeaede5e chore(deps): update dependency sass to v1.80.3 | 19 hours ago | |
---|---|---|
.. | ||
.storybook | 2 days ago | |
.vscode | 2 years ago | |
assets | 1 year ago | |
components | 2 days ago | |
docs | 1 year ago | |
interfaces | 1 year ago | |
pages | 1 month ago | |
public | 3 months ago | |
services | 1 year ago | |
stories | 8 months ago | |
style-definitions | 1 year ago | |
styles | 1 year ago | |
tests | 9 months ago | |
types | 6 months ago | |
utils | 3 months ago | |
.env.development | 4 years ago | |
.env.production | 4 years ago | |
.eslintignore | 11 months ago | |
.eslintrc.js | 1 month ago | |
.gitignore | 2 years ago | |
.knip.json | 2 days ago | |
.prettierignore | 1 year ago | |
.prettierrc | 2 years ago | |
.stylelintrc.json | 1 year ago | |
LICENSE | 4 years ago | |
README.md | 1 year ago | |
doctor-storybook.log | 2 days ago | |
favicon.ico | 4 years ago | |
jest.config.js | 2 days ago | |
next-env.d.ts | 2 days ago | |
next.config.js | 6 months ago | |
package-lock.json | 19 hours ago | |
package.json | 19 hours ago | |
postcss.config.js | 2 years ago | |
renovate.json | 2 years ago | |
tsconfig.json | 1 year ago |
The Owncast web frontend is a Next.js project with React components, TypeScript, Sass styling, using Ant Design UI components.
First, install the dependencies.
npm install --include=dev
You can start the Storybook UI for exploring, testing, and developing components by running:
npm run storybook
This allows for components to be made available without the need of the server to be running and changes to be made in isolation.
Docs
tab to read any specific documentation that may have been written about how this component works.Canvas
tab of the component you selected and see if there's a Design attached to it.See the extra how-to guide for components here: Components How-to.
Make sure you're running an instance of Owncast on localhost:8080, as your copy of the admin will look to use that as the API.
Next, start the web project with npm.
npm run dev
You can add or edit a pages by modifying pages/something.js
. The page auto-updates as you edit the file.
Routes will automatically be available for this new page components.
Since this project hits API endpoints you should make requests in componentDidMount
, and not in getStaticProps
, since they're not static and we don't want to fetch them at build time, but instead at runtime.
A list of API end points can be found here: https://owncast.online/api/development/
The pages under /admin
require authentication to make API calls.
Auth: HTTP Basic
username: admin
pw: [your streamkey]
To learn more about Next.js, take a look at the following resources: