add integration example

.eslintignore

@@ -4,6 +4,7 @@ lib
 output
 src/generators/template
 test/generators/template
+examples/integrate-with-next
 examples/integrate-with-react
 src/processors/TemplateInputProcessor.ts
 test/processors/TemplateInputProcessor.spec.ts

docs/integration.md

@@ -16,10 +16,34 @@ This readme file goes into details how to integrate Modelina into various enviro
 Integrating Modelina into websites is is one of the core features, and each framework is different, so here are some of examples:
 
 - [Using Modelina in React](../examples/integrate-with-react/)
+- [Using Modelina in Next](../examples/integrate-with-next/)
+- 
+> NOTICE: Modelina only works server side and not on the client side. In the React example its always rendered on the server side, and with Next you have to utilize [data fetching techniques](https://nextjs.org/docs/basic-features/data-fetching/overview) to retrieve the generated code from the server. 
 
 There are a few exceptions to the features Modelina support in a website environment. Those are listed here below:
 
-- You cannot use the [file generator](./advanced.md#generate-models-to-separate-files) to write to the client's disk.
+- You cannot use the [file generator](./advanced.md#generate-models-to-separate-files) to write to the client's disk, instead utilize the `generateCompleteModels` function, that gives you the same generated output in memory instead of writing it to files.
+
+### FAQ
+
+#### TypeScript and Jest
+If you ever encounter `Jest encountered an unexpected token` and something along the lines of:
+
+```
+Details:
+    /Users/lagoni/Documents/github/generator-model-sdk/node_modules/@stoplight/spectral-core/node_modules/jsonpath-plus/dist/index-browser-esm.js:1103
+    export { JSONPath };
+    ^^^^^^
+    SyntaxError: Unexpected token 'export'
+```
+
+Make sure your Jest configuration contains the following:
+
+```
+transformIgnorePatterns = [
+  '/node_modules/@stoplight/spectral-core/node_modules/(!?jsonpath-plus)',
+];
+```
 
 ### Security NOTICE
 Do NOT enable users to write their own option callbacks. This includes but not limits to preset hooks and constrain rules. The reason for this is that in some cases it will enable arbitrary code execution on your webserver (which you most probably don't want!). 

examples/README.md

@@ -69,6 +69,7 @@ These are all the basic generator examples that shows a bare minimal example of
 ## Integrations
 These are examples of how you can integrate Modelina into a specific scenario:
 - [integrate with React](./integrate-with-react) - A basic example that shows how you can integrate Modelina with React.
+- [integrate-with-next](./integrate-with-next) - A basic example that shows how you can integrate Modelina with Next.
 
 ## Python
 These are all specific examples only relevant to the Python generator:

examples/integrate-with-next/.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["next/babel"]
+}

examples/integrate-with-next/.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

examples/integrate-with-next/README.md

@@ -0,0 +1,17 @@
+# Integrate with Next
+
+A basic example of how to integrate Modelina into Next. This particular example is with Jest and TypeScript.
+
+## How to run this example
+
+Run this example using:
+
+```sh
+npm i && npm run start
+```
+
+If you are on Windows, use the `start:windows` script instead:
+
+```sh
+npm i && npm run start:windows
+```

examples/integrate-with-next/jest.config.js

@@ -0,0 +1,37 @@
+const nextJest = require('next/jest')
+
+const createNextJestConfig = nextJest({
+  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+  dir: './',
+});
+
+async function createCustomJestConfig() {
+  // Add any custom config to be passed to Jest
+  /** @type {import('jest').Config} */
+  const customJestConfig = {
+    moduleNameMapper: {
+      // Handle module aliases (this will be automatically configured for you soon)
+      '^@/components/(.*)$': '<rootDir>/components/$1',
+      '^@/pages/(.*)$': '<rootDir>/src/pages/$1',
+      '^@/styles/(.*)$': '<rootDir>/src/styles/$1'
+    },
+    testEnvironment: 'jest-environment-jsdom',
+    setupFilesAfterEnv: ['<rootDir>/jest.setup.js']
+  };
+  /**
+   * NextJest adds and overwrite a lot of configurations
+   */
+  let fullConfig = await createNextJestConfig(customJestConfig)();
+
+  // We have to configure Jest to transform a specific 
+  fullConfig.transformIgnorePatterns = [
+    '^.+\\.module\\.(css|sass|scss)$',
+    // Ignore all but this
+    '../../../node_modules/@stoplight/spectral-core/node_modules/(!?jsonpath-plus)',
+  ];
+
+  return fullConfig;
+}
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+module.exports = createCustomJestConfig;

examples/integrate-with-next/jest.setup.js

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';