johan-mouchet.com's Introduction

johan-mouchet.com

Johan Mouchet's portfolio, open sourced on GitHub.

About This Website

This website is,

Bootstrapped with Next.js
Built with React
Pulling data from Prismic using GraphQL and Apollo
Maintaining a design system with Storybook, deployed with Chromatic
Type-checked with TypeScript
Unit and snapshot tested with Vitest and React Testing Library
Using CSS Modules, Sass and post-processing
Linted with ESlint and Stylelint; formatted with Prettier; enforced by Husky and lint-staged
Deployed, pre-rendered, with Netlify

In the project directory, you can pnpm + :

dev: Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.
storybook: Runs Storybook, an open source tool for developing UI components in isolation. Open http://localhost:9009/ to view it in the browser.
test: Launches the Vitest test runner in the interactive watch mode.
type-check: Runs TypeScript, as a static type checker.
lint:js: Runs the ESLint linter, a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs.
lint:css: Runs the stylelint linter, a mighty, modern linter that helps you avoid errors and enforce conventions in your styles.
format: Runs ESLint and stylelint with the --fix option, as well as Prettier with the --write option to automatically fix problems.
analyze: Runs @next/bundle-analyzer to analyze, and debug JavaScript and Sass code bloat through source maps.
build: Builds the app for production to the .next folder.
build:storybook: Builds Storybook for production to the storybook-static folder.
build:all: Builds both the app and Storybook for production to the respective folders.
codegen: Generates TypeScript types for the Prismic GraphQL schema, requires to set a PRISMIC_CUSTOM_TYPES_API_TOKEN environment variable.

Recommend Projects