Accords-Library-Archive
/
accords-library.com
1
0
Fork 0
Code Issues Pull Requests 5 Packages Projects Releases Wiki Activity
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.
139 Commits 14 Branches 0 Tags 6.4 MiB
TypeScript 98.7%
CSS 0.9%
JavaScript 0.4%
Go to file
DrMint 4928acdee7 Added prettier ignore config 2022-03-13 15:49:04 +01:00
public Added testing and display recorders info 2022-02-27 08:17:58 +01:00
src run prettier 2022-03-13 15:39:19 +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
.prettierignore Added prettier ignore config 2022-03-13 15:49:04 +01:00
LICENSE Added stuff 2021-11-04 12:45:18 +01:00
README.md Upadated REAME 2022-03-07 21:57:56 +01:00
next-env.d.ts Added animation to tooltip opening closing 2022-03-13 15:34:51 +01:00
next.config.js Added missing translations here and there 2022-03-05 16:34:19 +01:00
package-lock.json Now use Tippy for Tooltips 2022-03-13 14:54:56 +01:00
package.json Now use Tippy for Tooltips 2022-03-13 14:54:56 +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_prettier.sh run prettier 2022-03-13 15:39:19 +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 Fixed errors that prevented building 2022-03-12 14:03:26 +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

Image Processor

  • Convert the images from the CMS to 4 formats
    • Small: 512x512, quality 60, .webp
    • Medium: 1024x1024, quality 75, .webp
    • Large: 2048x2048, quality 80, .webp
    • Og: 512x512, quality 60, .jpg

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
  • SSG (Static Site Generation):
    • The website is built before running in production
    • Performances are great, and possibility to deploy the app using a CDN
  • OpenGraph and Metadata
    • Good defaults for the metadate and OpenGraph properties
    • Each page can provide the thumbnail, title, description to be used
  • 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