Monorepo of everything related to frontend app development at the WPRDC.
ARCHITECTURE.md - gives a high-level overview of the codebase.
This monorepo is maintained using Turborepo and includes the following packages/apps:
All apps built using Next unless otherwise stated.
| App | Description | Links |
|---|---|---|
@wprdc/parcels-n-at |
Parcel data explorer and downloader app. | 📓 README |
@wprdc/geomancer |
Data mapping tool. | 📓 README |
The packages directory contains common libraries used by apps and shared tool configurations used everywhere.
| Package | Description |
|---|---|
@wprdc/ui |
React component library shared by all WPRDC apps. This also includes some utilities (like formatters) and widgets: special composite components that use WPRDC APIs. |
@wprdc/api |
Typescript library that provides APIs to CKAN as well as domain-specific APIs that are designed around available data on the WPRDC. |
@wprdc/types |
Typescript type library that provides common types. |
@wprdc/typescript-config |
Common TypeScript configurations. Except for the package.json each file here is a tsconfig.json file. Packages and apps will each have their own tsconfig.json file that will extend from one of the files here. 📓 Reference |
@wprdc/tailwind-config |
Common Tailwind CSS configuration shared by UI library and applications. 📓 Reference |
@wprdc/eslint-config |
ESLint configurations. Each package and app will have its own .eslintrc.js that will extend from one of the common configurations here. |
- Install pnpm
- Clone repo
- Install dependencies -
pnpm install - Run tasks...
The following tasks are defined:
- build - run package-specific build command
- lint - run ESLint per package
- type-check - check types across packages
- dev - run development mode for each package
Use --filter to limit tasks to specific packages or
apps - reference
Several dev tools, frameworks and libraries have settings files scattered throughout the repo. Configuration files may be found at the root dir of the project,in the shared configuration libraries, and/or at the root of each individual application and project.
| Tool | Description | Configuration Files |
|---|---|---|
| pnpm | Package manager. | pnpm-workspace.yaml pnpm-lock.yaml package.json |
| Turborepo | Monorepo build system | turbo.json package.json |
| Prettier | Opinionated Code Formatter | .prettierrc |
| tsup | Bundler used by Turborepo | tsup.config.ts |
| PostCSS | CSS Processor - used to bundle tailwind with code | postcss.config.js |
| Next | React framework | next.config.js next.config.*.js |
| PostCSS | CSS Processor - used to bundle tailwind with code | postcss.config.js |
The following libraries are heavily relied upon by the components and apps.
| Library | Description |
|---|---|
| React Aria | Components/utils for building accessible React components. |
| MapLibre GL JS | Map rendering engine. |
| react-map-gl | React component wrapper for MapLibre GL JS maps. |
| React Icons | Provides Icons from various icon libraries |