Skip to content

Lint Markdown #1264

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 29, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .github/workflows/cd.yml
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ on:
branches:
- main
- '*.*'
- ci/github-actions

jobs:
deploy:
Expand Down
4 changes: 3 additions & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,9 @@ jobs:
uses: github/super-linter@v3
env:
VALIDATE_ALL_CODEBASE: false
DEFAULT_BRANCH: main
VALIDATE_EDITORCONFIG: false
VALIDATE_JSCPD: false
DEFAULT_BRANCH: 2.6
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

- uses: actions/cache@v2
Expand Down
4 changes: 4 additions & 0 deletions .markdownlint.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
MD013:
line_length: 400
no-inline-html:
allowed_elements: [a, p, img, br]
42 changes: 29 additions & 13 deletions admin/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,9 @@

### AdminGuesser

`<AdminGuesser>` creates a complete Admin Context and Interface, rendering automatically an [`<AdminUI>` component](https://marmelab.com/react-admin/Admin.html#unplugging-the-admin-using-admincontext-and-adminui) for resources exposed by a web API documented with any format supported by `@api-platform/api-doc-parser` (for Hydra documented APIs, use the [`<HydraAdmin>`component](admin/components.md#hydraadmin) instead). It also creates a [`schemaAnalyzer`](admin/components.md#schemaAnalyzer) context, where the schemaAnalyzer service (for getting information about the provided API documentation) is stored.
`<AdminGuesser>` creates a complete Admin Context and Interface, rendering automatically an [`<AdminUI>` component](https://marmelab.com/react-admin/Admin.html#unplugging-the-admin-using-admincontext-and-adminui) for resources exposed by a web API documented with any format supported by `@api-platform/api-doc-parser` (for Hydra documented APIs,
use the [`<HydraAdmin>`component](admin/components.md#hydraadmin) instead). It also creates a [`schemaAnalyzer`](admin/components.md#schemaAnalyzer) context, where the schemaAnalyzer service (for getting information about the provided API documentation) is stored.

The `<AdminGuesser>` renders all exposed resources by default, but you can choose what resource you want to render by passing [`<ResourceGuesser>` components](admin/components/#resourceguesser) as children.
Deprecated resources are hidden by default, but you can add them back using an explicit `<ResourceGuesser>` component.

Expand All @@ -30,7 +32,8 @@ const App = () => (
export default App;
```

**Props**
#### Props

| Name | Type | Value | required | Description |
|-------------------|--------------------|----------------|----------|----------------------------------------------------------------------------------|
| dataProvider | object or function | - | yes | communicates with your API |
Expand All @@ -41,7 +44,8 @@ export default App;

### ResourceGuesser

Based on React-Admin's [`<Resource>` component](https://marmelab.com/react-admin/Resource.html), the ResourceGuesser provides default props [`<CreateGuesser>`](admin/components.md#createguesser), [`<ListGuesser>`](admin/components.md#listguesser), [`<EditGuesser>`](admin/components.md#editguesser) and [`<ShowGuesser>`](admin/components.md#showguesser). Otherwise you can pass it your own CRUD components using `create`, `list`, `edit`, `show` props.
Based on React-Admin's [`<Resource>` component](https://marmelab.com/react-admin/Resource.html), the ResourceGuesser provides default props [`<CreateGuesser>`](admin/components.md#createguesser), [`<ListGuesser>`](admin/components.md#listguesser), [`<EditGuesser>`](admin/components.md#editguesser) and [`<ShowGuesser>`](admin/components.md#showguesser).
Otherwise you can pass it your own CRUD components using `create`, `list`, `edit`, `show` props.

```javascript
// App.js
Expand All @@ -66,7 +70,8 @@ const App = () => (
export default App;
```

**Props**
#### ResourceGuesser Props

| Name | Type | Value | required | Description |
|------|--------|-------|----------|--------------------------|
| name | string | - | yes | endpoint of the resource |
Expand All @@ -77,8 +82,11 @@ You can also use props accepted by React-Admin's [`<Resource>` component](https:

### ListGuesser

Based on React-Admin's [`<List>`](https://marmelab.com/react-admin/List.html), ListGuesser displays a list of resources in a [`<Datagrid>`](https://marmelab.com/react-admin/List.html#the-datagrid-component), according to children passed to it (usually [`<FieldGuesser>`](admin/components/#fieldguesser) or any [`field` component](https://marmelab.com/react-admin/Fields.html#basic-fields) available in React-Admin).
Based on React-Admin's [`<List>`](https://marmelab.com/react-admin/List.html), ListGuesser displays a list of resources in a [`<Datagrid>`](https://marmelab.com/react-admin/List.html#the-datagrid-component), according to children passed to it (usually [`<FieldGuesser>`](admin/components/#fieldguesser) or any [`field` component](https://marmelab.com/react-admin/Fields.html#basic-fields)
available in React-Admin).

Use `hasShow` and `hasEdit` props if you want to display `show` and `edit` buttons (both set to `true` by default).

By default, `<ListGuesser>` comes with [`<Pagination>`](admin/components.md#pagination).

```javascript
Expand All @@ -96,14 +104,15 @@ export const BooksList = props => (
</ListGuesser>
);
```
**Props**

#### ListGuesser Props

| Name | Type | Value | required | Description |
|----------|------------------|-------|----------|-----------------------------------------|
| children | node or function | - | no | - |
| resource | string | - | yes | endpoint of the resource |
| filters | element | - | no | filters that can be applied to the list |


You can also use props accepted by React-Admin's [`<List>`](https://marmelab.com/react-admin/List.html).

### CreateGuesser
Expand All @@ -126,7 +135,8 @@ export const BooksCreate = props => (
);
```

**Props**
#### CreateGuesser Props

| Name | Type | Value | required | Description |
| Name | Type | Value | required | Description |
|----------|------------------|-------|----------|--------------------------|
Expand Down Expand Up @@ -155,7 +165,8 @@ export const BooksEdit = props => (
);
```

**Props**
#### EditGuesser Props

| Name | Type | Value | required | Description |
|----------|------------------|-------|----------|--------------------------|
| children | node or function | - | no | - |
Expand All @@ -182,7 +193,8 @@ export const BooksShow = props => (
);
```

**Props**
#### ShowGuesser Props

| Name | Type | Value | required | Description |
|----------|------------------|-------|----------|--------------------------|
| children | node or function | - | no | - |
Expand Down Expand Up @@ -214,7 +226,8 @@ const App = () => (
export default App;
```

**Props**
#### HydraAdmin Props

| Name | Type | Value | required | Description |
|------------|--------|-------|----------|-----------------------|
| entrypoint | string | - | yes | entrypoint of the API |
Expand Down Expand Up @@ -252,7 +265,9 @@ export const BooksShow = props => (
</ShowGuesser>
)
```
**Props**

#### FieldGuesser Props

| Name | Type | Value | required | Description |
|--------|--------|-------|----------|--------------------------|
| source | string | - | yes | endpoint of the resource |
Expand All @@ -263,7 +278,8 @@ You can also use props accepted by React-Admin's [`Basic Fields`](https://marmel

Uses React-Admin's [`<ReferenceInput>`](https://marmelab.com/react-admin/Inputs.html#referenceinput) to generate inputs according to your API documentation (e.g. number HTML input for numbers, checkbox for booleans, selectbox for relationships...)

**Props**
#### InputGuesser Props

| Name | Type | Value | required | Description |
|--------|--------|-------|----------|--------------------------|
| source | string | - | yes | endpoint of the resource |
2 changes: 1 addition & 1 deletion admin/customizing.md
Original file line number Diff line number Diff line change
Expand Up @@ -185,4 +185,4 @@ For instance, using an autocomplete input is straightforward, [checkout the dedi
API Platform is built on top of [React Admin](https://marmelab.com/react-admin/).
You can use all the features provided by the underlying library with API Platform Admin, including support for [file upload](https://marmelab.com/react-admin/DataProviders.html#decorating-your-data-provider-example-of-file-upload), [authentication](https://marmelab.com/react-admin/Authentication.html), [authorization](https://marmelab.com/react-admin/Authorization.html) and deeper customization.

To learn more about these capabilities, refer to [the React Admin documentation](https://marmelab.com/react-admin/).
To learn more about these capabilities, refer to [the React Admin documentation](https://marmelab.com/react-admin/).
17 changes: 13 additions & 4 deletions admin/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,21 @@ Otherwise, all you need to install API Platform Admin is a JavaScript package ma

If you don't have an existing React Application, create one using [Create React App](https://create-react-app.dev/):

$ yarn create react-app my-admin
```console
yarn create react-app my-admin
```

Go to the directory of your project:

$ cd my-admin
```console
cd my-admin
```

Finally, install the `@api-platform/admin` library:

$ yarn add @api-platform/admin
```console
yarn add @api-platform/admin
```

## Creating the Admin

Expand Down Expand Up @@ -59,7 +65,10 @@ nelmio_cors:
Clear the cache to apply this change:
$ docker-compose exec php bin/console cache:clear --env=prod
```console
docker-compose exec php \
bin/console cache:clear --env=prod
```

Your new administration interface is ready! Type `yarn start` to try it!

Expand Down
4 changes: 2 additions & 2 deletions admin/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ API Platform Admin is a tool to automatically create a beautiful and fully featu
for any API supporting [the Hydra Core Vocabulary](http://www.hydra-cg.com/) or other API specification formats supported by [`@api-platform/api-doc-parser`](https://github.com/api-platform/api-doc-parser) (experimental support for [OpenAPI](https://www.openapis.org/) is also available).

API Platform Admin is the perfect companion of APIs created
using [the API Platform framework](https://api-platform.com), but also supports APIs written with any other programming language or framework as long as they expose a standard Hydra API documentation.
using [the API Platform framework](https://api-platform.com), but also supports APIs written with any other programming language or framework as long as they expose a standard Hydra API documentation.

API Platform Admin is a 100% standalone Single-Page-Application with no coupling to the server part,
according to the API-first paradigm.
Expand All @@ -21,7 +21,7 @@ You can **customize everything** by using provided React Admin and [Material UI
* Automatically generates an admin interface for all the resources of the API thanks to hypermedia features of Hydra
* Generates 'list', 'create', 'show', and 'edit' screens, as well as a delete button
* Generates suitable inputs and fields according to the API doc (e.g. number HTML input for numbers, checkbox for booleans, selectbox for relationships...)
* Generates suitable inputs and fields according to Schema.org types if available (e.g. email field for http://schema.org/email)
* Generates suitable inputs and fields according to Schema.org types if available (e.g. email field for `http://schema.org/email`)
* Handles relationships
* Supports pagination
* Supports filters and ordering
Expand Down
2 changes: 1 addition & 1 deletion client-generator/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ Client Generator is the fastest way to scaffold fully featured webapps and nativ

![Screencast](images/client-generator-demo.gif)

*Generated React and React Native apps, updated in real time*
## Generated React and React Native Apps, Updated in Real Time

It is able to generate apps using the following frontend stacks:

Expand Down
6 changes: 3 additions & 3 deletions client-generator/nextjs.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,11 +18,11 @@ Create a [Next.js application with express server](https://github.com/zeit/next.

Enable TypeScript in your next project

$ yarn add --dev typescript @types/react @types/node
yarn add --dev typescript @types/react @types/node

Install required dependencies:

$ yarn add lodash.get lodash.has @types/lodash isomorphic-unfetch formik
yarn add lodash.get lodash.has @types/lodash isomorphic-unfetch formik

## Generating Routes

Expand All @@ -35,7 +35,7 @@ Install required dependencies:

You can launch the server with

$ yarn dev
yarn dev

Go to `http://localhost:3000/books/` to start using your app.

Expand Down
39 changes: 26 additions & 13 deletions client-generator/nuxtjs.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,19 @@ The Nuxt.js Client Generator generates components for Server Side Rendered appli

Create a [Nuxt.js application](https://nuxtjs.org/guides/get-started/installation#using-create-nuxt-app). The easiest way is to execute:

$ npx create-nuxt-app your-app-name
# or
$ yarn create nuxt-app your-app-name
```console
npx create-nuxt-app your-app-name
```

It will ask you some questions you can use these answers :
or:

```console
yarn create nuxt-app your-app-name
```

It will ask you some questions you can use these answers :

```console
Project name: your-app-name
Programming language: JavaScript
Package manager: Yarn
Expand All @@ -30,8 +36,10 @@ Deployment target: Static (Static/JAMStack hosting)

Install required dependencies:

$ yarn add moment lodash vue-i18n vuelidate vuex-map-fields nuxt-i18n
# yarn add --dev @nuxtjs/vuetify @nuxtjs/fontawesome
```console
yarn add moment lodash vue-i18n vuelidate vuex-map-fields nuxt-i18n
yarn add --dev @nuxtjs/vuetify @nuxtjs/fontawesome
```

## Updating nuxtjs config

Expand All @@ -48,19 +56,22 @@ Update your `nuxt.config.js` with following:
// to avoid name conflicts in generators
components: false,
```

## Generating Routes

$ npx @api-platform/client-generator https://demo.api-platform.com . --generator nuxt
# Replace the URL by the entrypoint of your Hydra-enabled API
```console
npx @api-platform/client-generator https://demo.api-platform.com . --generator nuxt
```

> Note: Omit the resource flag to generate files for all resource types exposed by the API.
Replace the URL by the entrypoint of your Hydra-enabled API

## Updating default layout
**Note:** Omit the resource flag to generate files for all resource types exposed by the API.

## Updating default layout

Update your `layouts/default.vue` with following:

```javascript
```vue
<template>
<v-app>
<alert />
Expand Down Expand Up @@ -132,9 +143,11 @@ export default {

## Starting the Project

You can launch the server with
You can launch the server with:

$ yarn dev
```console
yarn dev
````

Go to `https://localhost:3000/books/` to start using your app.

Expand Down
Loading