This is a Next.js project bootstrapped with create-next-app
.
When updating dependencies, there are various files that must be kept up-to-date. Newly added, or updated dependencies can introduce unwanted/malicious scripts that can introduce risks for users and/or developers. The lavamoat allow-scripts
feature allows us to deny by default, but adds some additional steps to the usual workflow.
yarn.lock
:
- Instead of running
yarn
oryarn install
, runyarn setup
to ensure theyarn.lock
file is in sync and that dependency scripts are run according to theallowScripts
policy (set inpackages.json
) - If
lavamoat
detects new scripts that are not explicitely allowed/denied, it'll throw and error with details (see below) - Running
yarn setup
will also dedupe theyarn.lock
file to reduce the dependency tree. Note CI will fail if there are dupes inyarn.lock
!
The allowScripts
configuration in package.json
:
- There are two ways to configure script policies:
- Update the allow-scripts section manually by adding the missing package in the
allowScripts
section inpackage.json
- Run
yarn allow-scripts auto
to update theallowScripts
configuration automatically
- Update the allow-scripts section manually by adding the missing package in the
- Review each new package to determine whether the install script needs to run or not, testing if necessary.
- Use
npx can-i-ignore-scripts
to help assessing whether scripts are needed
First, run the development server:
npm run dev
# or
yarn dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx
. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts
.
The pages/api
directory is mapped to /api/*
. Files in this directory are treated as API routes instead of React pages.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.
- Copy one of the other color themes in tailwind.config.js (starting line 25)
- Modify the colors. For the variables bkg-* and fgd-* pick a base color for bkg-1 and fgd-1 then adjust the lightness for 2-4. Use this same process to create dark/hover variations for the colors that have these properties. The base color can be anything that works for your theme.
- Add your corresponding theme values here. The format needs to be converted to HEX, you can paste the HSL values into Coolors to do this.
- Copy one of the other themes in global.css and modify to match your theme name in tailwind.config.js
- Add a translation variable for your theme name in locales. Theme names are to be added to settings.json and make sure to add this to each locale (they can all be in English to start with). Make sure the value matches data-theme from your css vars in global.css
- Add your theme to the THEMES array in display settings. It should go after mango-classic then in alphabetical order. You need to use the translation key you added to the locales.