Front end for the Accord's Library website. Accord's Library is a archival project focused on the works of Yoko Taro, and the Drakegard & NieR universes.
Go to file
DrMint 250adfc746 Added setting menu with textsize and font selection 2022-03-06 16:50:17 +01:00
public Added testing and display recorders info 2022-02-27 08:17:58 +01:00
src Added setting menu with textsize and font selection 2022-03-06 16:50:17 +01:00
testing_logs Added testing and display recorders info 2022-02-27 08:17:58 +01:00
.eslintrc.json Initial commit from Create Next App 2021-11-03 23:46:45 +01:00
.gitignore Added testing and display recorders info 2022-02-27 08:17:58 +01:00
LICENSE Added stuff 2021-11-04 12:45:18 +01:00
README.md Updated README 2022-03-03 23:28:41 +01:00
next-env.d.ts Updated Nextjs to 12.0.7 2022-01-01 21:34:10 +01:00
next.config.js Added missing translations here and there 2022-03-05 16:34:19 +01:00
package-lock.json Added setting menu with textsize and font selection 2022-03-06 16:50:17 +01:00
package.json Added setting menu with textsize and font selection 2022-03-06 16:50:17 +01:00
postcss.config.js Start using TailwindCSS 2022-01-01 20:04:48 +01:00
run_accords_build.sh Added testing and display recorders info 2022-02-27 08:17:58 +01:00
run_accords_dev.sh Changed port of the dev web server 2022-03-04 13:11:44 +01:00
run_accords_prod.sh Tested deployment 2022-02-24 13:25:43 +01:00
run_accords_testing.sh Disable testing log on npm build 2022-03-06 02:39:37 +01:00
tailwind.config.js Added setting menu with textsize and font selection 2022-03-06 16:50:17 +01:00
tsconfig.json Added testing and display recorders info 2022-02-27 08:17:58 +01:00

README.md

Accords-library.com

Technologies

Back

  • CMS: Stapi
    • GraphQL endpoint
    • Multilanguage support
    • Markdown format for the rich text fields

Front (this repository)

  • Language: TypeScript
  • Queries: GraphQL
    • GraphQL Code Generator to automatically generated types for the operations variables and responses
    • The operations are stored in a graphql file and then retrieved and wrap as an actual TypeScript function
  • Markdown: markdown-to-jsx
    • Support for Arbitrary React Components and Component Props!
  • Styling: Tailwind CSS
    • Good typographic defaults using Tailwind/Typography
    • Beside the theme declaration no CSS outside of Tailwind CSS
    • Manually added support for scrollbar styling
    • Support for Material Icons
    • Support for light and dark mode with a manual switch and system's selected theme by default
    • Support for creating any arbitrary theming mode by swapping CSS variables
  • Framework: Next.js (React)
    • Multilanguage support
  • State Management: React Context
    • Persistent app state using LocalStorage
  • Support for many screen sizes and resolutions
  • Data quality testing
    • Data from the CMS is subject to a battery of tests (about 20 warning types and 40 error types) at build time
    • Each warning/error comes with a front-end link to the incriminating element, as well as a link to the CMS to fix it.
    • Check for completeness, conformity, and integrity

Installation

git clone https://github.com/Accords-Library/accords-library.com.git
cd accords-library.com
npm install

Create a env file:

nano .env.local

Enter the followind information:

URL_GRAPHQL=https://url-to.strapi-accords-library.com/graphql
ACCESS_TOKEN=genatedcode-by-strapi-api
NEXT_PUBLIC_URL_CMS=https://url-to.strapi-accords-library.com/
NEXT_PUBLIC_URL_IMG=https://url-to.img-accords-library.com/
NEXT_PUBLIC_URL_SELF=https://url-to-front-accords-library.com

Run in dev mode:

./run_accords_dev.sh

OR build and run in production mode

./run_accords_build.sh
./run_accords_prod.sh