[monorepo][m] - simplify examples

This commit is contained in:
Luccas Mateus de Medeiros Gomes 2023-04-24 13:07:22 -03:00
parent cea928af7d
commit 975887c127
10 changed files with 5953 additions and 113 deletions

View File

@ -1,6 +1,5 @@
{
"extends": [
"plugin:@nrwl/nx/react-typescript",
"next",
"next/core-web-vitals",
"../../.eslintrc.json"

View File

@ -1,17 +1,46 @@
This is a repo intended to serve as an example of a data catalog that get its data from a CKAN Instance.
- Creating a new file inside o `examples` with `create-next-app` like so:
```
npx create-next-app <app-name> --example https://github.com/datopian/portaljs/tree/main/ --example-path examples/ckan-example
npx create-next-app <app-name> --example https://github.com/datopian/portaljs/tree/main/examples/ckan-example
cd <app-name>
```
- Inside `<app-name>` go to the `project.json` file and replace all instances of `ckan-example` with `<app-name>`
- Set the `DMS` env variable to the Url of the CKAN Instance Ex: `export DMS=https://demo.dev.datopian.com`
- This project uses CKAN as a backend, so you need to point the project to the CKAN Url desired, you can do so by setting up the `DMS` env variable in your terminal or adding a `.env` file with the following content:
```
DMS=<ckan url>
```
- Run the app using:
```
nx serve <app-name>
npm run dev
```
Congratulations, you now have something similar to this running on `http://localhost:4200`
![](https://media.discordapp.net/attachments/1069718983604977754/1098252297726865408/image.png?width=853&height=461)
If yo go to any one of those pages by clicking on `More info` you will see something similar to this
![](https://media.discordapp.net/attachments/1069718983604977754/1098252298074988595/image.png?width=853&height=461)
## Deployment
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fdatopian%2Fportaljs%2Ftree%2Fmain%2Fexamples%2Fckan-example&env=DMS&envDescription=URL%20For%20the%20CKAN%20Backend%20Ex%3A%20https%3A%2F%2Fdemo.dev.datopian.com)
By clicking on this button, you will be redirected to a page which will allow you to clone the content into your own github/gitlab/bitbucket account and automatically deploy everything.
## Extra commands
You can also build the project for production with
```
npm run build
```
And run using the production build like so:
```
npm run start
```

View File

@ -1,9 +1,3 @@
// eslint-disable-next-line @typescript-eslint/no-var-requires
const { withNx } = require('@nrwl/next/plugins/with-nx');
/**
* @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
**/
const nextConfig = {
publicRuntimeConfig: {
DMS: process.env.DMS ? process.env.DMS : '',
@ -18,11 +12,6 @@ const nextConfig = {
],
};
},
nx: {
// Set this to true if you would like to use SVGR
// See: https://github.com/gregberge/svgr
svgr: false,
},
};
module.exports = withNx(nextConfig);
module.exports = nextConfig;

5842
examples/ckan-example/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,33 @@
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@heroicons/react": "^2.0.17",
"@types/node": "18.16.0",
"@types/react": "18.0.38",
"@types/react-dom": "18.0.11",
"eslint": "8.39.0",
"eslint-config-next": "13.3.1",
"next": "13.3.1",
"next-seo": "^6.0.0",
"octokit": "^2.0.14",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-markdown": "^8.0.7",
"remark-gfm": "^3.0.1",
"typescript": "5.0.4"
},
"devDependencies": {
"@tailwindcss/typography": "^0.5.9",
"autoprefixer": "^10.4.14",
"postcss": "^8.4.23",
"tailwindcss": "^3.3.1"
}
}

View File

@ -1,15 +1,6 @@
const { join } = require('path');
// Note: If you use library-specific PostCSS/Tailwind configuration then you should remove the `postcssConfig` build
// option from your application's configuration (i.e. project.json).
//
// See: https://nx.dev/guides/using-tailwind-css-in-react#step-4:-applying-configuration-to-libraries
module.exports = {
plugins: {
tailwindcss: {
config: join(__dirname, 'tailwind.config.js'),
},
tailwindcss: {},
autoprefixer: {},
},
};
}

View File

@ -1,17 +1,15 @@
const { createGlobPatternsForDependencies } = require('@nrwl/react/tailwind');
const { join } = require('path');
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
join(
__dirname,
'{src,pages,components}/**/*!(*.stories|*.spec).{ts,tsx,html}'
),
...createGlobPatternsForDependencies(__dirname),
"./app/**/*.{js,ts,jsx,tsx,mdx}",
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
"./components/**/*.{js,ts,jsx,tsx,mdx}",
],
theme: {
extend: {},
},
plugins: [],
};
plugins: [
require('@tailwindcss/typography')
],
}

View File

@ -1,23 +1,20 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"jsx": "preserve",
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"skipLibCheck": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"incremental": true,
"types": ["jest", "node"]
"jsx": "preserve",
"incremental": true
},
"include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "next-env.d.ts"],
"exclude": [
"node_modules",
"jest.config.ts",
"src/**/*.spec.ts",
"src/**/*.test.ts"
]
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}

View File

@ -3,7 +3,7 @@ This is a repo intended to serve as a simple example of a data catalog that get
- Creating a new project with `create-next-app` like so:
```
npx create-next-app <app-name> --example https://github.com/datopian/portaljs/tree/main/ --example-path examples/simple-example
npx create-next-app <app-name> --example https://github.com/datopian/portaljs/tree/main/examples/simple-example
cd <app-name>
```
@ -25,6 +25,12 @@ Congratulations, you now have something similar to this running on `http://local
If yo go to any one of those pages by clicking on `More info` you will see something similar to this
![](https://i.imgur.com/AoJd4O0.png)
## Deployment
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fdatopian%2Fportaljs%2Ftree%2Fmain%2Fexamples%2Fsimple-example)
By clicking on this button, you will be redirected to a page which will allow you to clone the content into your own github/gitlab/bitbucket account and automatically deploy everything.
## Structure of `datasets.json`
@ -52,3 +58,18 @@ You can also add
- A `description` which is useful if you have more than one dataset for each repo, if not provided we are just going to use the repo description
- A `Name` which is useful if you want to give your dataset a nice name, if not provided we are going to use the junction of the `owner` the `repo` + the path of the README, in the exaple above it will be `fivethirtyeight/data/nba-raptor`
## Extra commands
You can also build the project for production with
```
npm run build
```
And run using the production build like so:
```
npm run start
```

View File

@ -4,63 +4,7 @@
"license": "MIT",
"scripts": {},
"private": true,
"dependencies": {
"@apollo/client": "^3.7.11",
"@apollo/react-hooks": "^4.0.0",
"@emotion/react": "^11.10.6",
"@emotion/styled": "^11.10.6",
"@flowershow/core": "^0.4.9",
"@flowershow/markdowndb": "^0.1.0",
"@flowershow/remark-callouts": "^1.0.0",
"@flowershow/remark-embed": "^1.0.0",
"@flowershow/remark-wiki-link": "^1.0.1",
"@headlessui/react": "^1.7.13",
"@heroicons/react": "^2.0.17",
"@mui/icons-material": "^5.11.16",
"@mui/material": "^5.11.16",
"@mui/x-data-grid": "^6.1.0",
"@opentelemetry/api": "^1.4.0",
"@tailwindcss/typography": "^0.5.9",
"@tanstack/react-table": "^8.8.5",
"apollo-cache-inmemory": "^1.6.6",
"apollo-link": "^1.2.14",
"apollo-link-rest": "^0.9.0",
"filesize": "^10.0.7",
"gray-matter": "^4.0.3",
"html-react-parser": "^3.0.15",
"markdown-it": "^13.0.1",
"next": "^13.2.1",
"next-mdx-remote": "^4.4.1",
"next-seo": "^6.0.0",
"next-translate": "^2.0.5",
"nock": "^13.3.0",
"octokit": "^2.0.14",
"papaparse": "^5.4.1",
"plotly.js-basic-dist": "^2.20.0",
"prop-types": "^15.8.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-markdown": "^8.0.7",
"react-next-github-btn": "^1.2.1",
"react-plotly.js": "^2.6.0",
"react-plotlyjs": "^0.4.4",
"react-vega": "^7.6.0",
"rehype-autolink-headings": "^6.1.1",
"rehype-katex": "^6.0.2",
"rehype-prism-plus": "^1.5.1",
"rehype-slug": "^5.1.0",
"remark-footnotes": "^4.0.1",
"remark-gfm": "^3.0.1",
"remark-math": "^5.1.1",
"remark-slug": "^7.0.1",
"remark-smartypants": "^2.0.0",
"remark-toc": "^8.0.1",
"slugify": "^1.6.6",
"timeago.js": "^4.0.2",
"tslib": "^2.3.0",
"vega": "^5.24.0",
"xlsx": "^0.18.5"
},
"dependencies": {},
"devDependencies": {
"@babel/preset-react": "^7.14.5",
"@nrwl/cypress": "15.9.2",
@ -84,7 +28,6 @@
"@types/react-dom": "18.0.11",
"@typescript-eslint/eslint-plugin": "^5.36.1",
"@typescript-eslint/parser": "^5.36.1",
"autoprefixer": "10.4.13",
"babel-jest": "^29.4.1",
"cypress": "^12.2.0",
"eslint": "~8.15.0",
@ -98,11 +41,9 @@
"jest": "^29.4.1",
"jest-environment-jsdom": "^29.4.1",
"nx": "15.9.2",
"postcss": "8.4.21",
"prettier": "^2.6.2",
"react-test-renderer": "18.2.0",
"swc-loader": "0.1.15",
"tailwindcss": "3.2.7",
"ts-jest": "^29.0.5",
"ts-node": "10.9.1",
"typescript": "~4.9.5"