diff --git a/nx-dev/feature-analytics/tsconfig.json b/nx-dev/feature-analytics/tsconfig.json index 59b9f4cfe0..3230750a88 100644 --- a/nx-dev/feature-analytics/tsconfig.json +++ b/nx-dev/feature-analytics/tsconfig.json @@ -4,8 +4,11 @@ "jsx": "react-jsx", "allowJs": true, "esModuleInterop": true, - "strictNullChecks": true, - "allowSyntheticDefaultImports": true + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true }, "files": [], "include": [], diff --git a/nx-dev/feature-conf/.babelrc b/nx-dev/feature-conf/.babelrc new file mode 100644 index 0000000000..9fcef0394f --- /dev/null +++ b/nx-dev/feature-conf/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["next/babel"], + "plugins": [] +} diff --git a/nx-dev/feature-conf/.eslintrc.json b/nx-dev/feature-conf/.eslintrc.json new file mode 100644 index 0000000000..734ddaceea --- /dev/null +++ b/nx-dev/feature-conf/.eslintrc.json @@ -0,0 +1,18 @@ +{ + "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"], + "ignorePatterns": ["!**/*"], + "overrides": [ + { + "files": ["*.ts", "*.tsx", "*.js", "*.jsx"], + "rules": {} + }, + { + "files": ["*.ts", "*.tsx"], + "rules": {} + }, + { + "files": ["*.js", "*.jsx"], + "rules": {} + } + ] +} diff --git a/nx-dev/feature-conf/README.md b/nx-dev/feature-conf/README.md new file mode 100644 index 0000000000..7cfe8af0f1 --- /dev/null +++ b/nx-dev/feature-conf/README.md @@ -0,0 +1,7 @@ +# nx-dev-feature-conf + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test nx-dev-feature-conf` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/nx-dev/feature-conf/jest.config.js b/nx-dev/feature-conf/jest.config.js new file mode 100644 index 0000000000..45c74cdcaa --- /dev/null +++ b/nx-dev/feature-conf/jest.config.js @@ -0,0 +1,9 @@ +module.exports = { + displayName: 'nx-dev-feature-conf', + preset: '../../jest.preset.js', + transform: { + '^.+\\.[tj]sx?$': 'babel-jest', + }, + moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'], + coverageDirectory: '../../coverage/nx-dev/feature-conf', +}; diff --git a/nx-dev/feature-conf/project.json b/nx-dev/feature-conf/project.json new file mode 100644 index 0000000000..8f639cab09 --- /dev/null +++ b/nx-dev/feature-conf/project.json @@ -0,0 +1,22 @@ +{ + "root": "nx-dev/feature-conf", + "sourceRoot": "nx-dev/feature-conf/src", + "projectType": "library", + "tags": ["scope:nx-dev", "type:feature"], + "targets": { + "lint": { + "executor": "@nrwl/linter:eslint", + "options": { + "lintFilePatterns": ["nx-dev/feature-conf/**/*.{ts,tsx,js,jsx}"] + } + }, + "test": { + "executor": "@nrwl/jest:jest", + "outputs": ["coverage/nx-dev/feature-conf"], + "options": { + "jestConfig": "nx-dev/feature-conf/jest.config.js", + "passWithNoTests": true + } + } + } +} diff --git a/nx-dev/feature-conf/src/index.ts b/nx-dev/feature-conf/src/index.ts new file mode 100644 index 0000000000..d29eff559d --- /dev/null +++ b/nx-dev/feature-conf/src/index.ts @@ -0,0 +1,3 @@ +export * from './lib/conf-schedule'; +export * from './lib/conf-speakers'; +export * from './lib/conf-workshop'; diff --git a/nx-dev/feature-conf/src/lib/conf-schedule.spec.tsx b/nx-dev/feature-conf/src/lib/conf-schedule.spec.tsx new file mode 100644 index 0000000000..c7c4c00662 --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-schedule.spec.tsx @@ -0,0 +1,9 @@ +import { render } from '@testing-library/react'; +import { ConfSchedule } from './conf-schedule'; + +describe('ConfSchedule', () => { + it('should render successfully', () => { + const { baseElement } = render(); + expect(baseElement).toBeTruthy(); + }); +}); diff --git a/nx-dev/feature-conf/src/lib/conf-schedule.tsx b/nx-dev/feature-conf/src/lib/conf-schedule.tsx new file mode 100644 index 0000000000..49a3de196a --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-schedule.tsx @@ -0,0 +1,116 @@ +interface ScheduleItem { + description: string; + speakers: Array; + time: string; + title: string; + type: 'event' | 'break'; +} + +export function ConfSchedule(): JSX.Element { + const scheduleItemsFor16: ScheduleItem[] = [ + { + type: 'event', + time: '10-10:45am', + title: 'Keynote - Setup Next.js to use Tailwind with Nx', + description: + 'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.', + speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'], + }, + { + type: 'break', + time: '10:45-11am', + title: 'Break', + description: '', + speakers: [], + }, + { + type: 'event', + time: '10-10:45am', + title: 'Keynote - Setup Next.js to use Tailwind with Nx', + description: + 'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.', + speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'], + }, + ]; + const scheduleItemsFor17: ScheduleItem[] = [ + { + type: 'event', + time: '10-10:45am', + title: 'Keynote - Setup Next.js to use Tailwind with Nx', + description: + 'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.', + speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'], + }, + { + type: 'break', + time: '10:45-11am', + title: 'Break', + description: '', + speakers: [], + }, + { + type: 'event', + time: '10-10:45am', + title: 'Keynote - Setup Next.js to use Tailwind with Nx', + description: + 'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.', + speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'], + }, + ]; + + return ( +
+
+
September 16
+
September 17
+
+
+ {scheduleItemsFor16.map((item) => + item.type === 'event' ? scheduleRow(item) : breakRow(item) + )} +
+
+
September 16
+
September 17
+
+
+ {scheduleItemsFor17.map((item) => + item.type === 'event' ? scheduleRow(item) : breakRow(item) + )} +
+
+ ); +} + +const scheduleRow = (item: ScheduleItem): JSX.Element => ( +
+
+ {item.time} + + {item.time} + +
+
+

{item.title}

+
{item.speakers.join(' & ')}
+
+

+ {item.description} +

+
+); + +const breakRow = (item: ScheduleItem): JSX.Element => ( +
+
+ {item.time} + + {item.time} + +
+
+

{item.title}

+
{item.description}
+
+
+); diff --git a/nx-dev/feature-conf/src/lib/conf-speakers.spec.tsx b/nx-dev/feature-conf/src/lib/conf-speakers.spec.tsx new file mode 100644 index 0000000000..ab0130f08e --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-speakers.spec.tsx @@ -0,0 +1,9 @@ +import { render } from '@testing-library/react'; +import { ConfSpeakers } from './conf-speakers'; + +describe('ConfSpeakers', () => { + it('should render successfully', () => { + const { baseElement } = render(); + expect(baseElement).toBeTruthy(); + }); +}); diff --git a/nx-dev/feature-conf/src/lib/conf-speakers.tsx b/nx-dev/feature-conf/src/lib/conf-speakers.tsx new file mode 100644 index 0000000000..87ad63e790 --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-speakers.tsx @@ -0,0 +1,77 @@ +import { Member, MemberCard } from '@nrwl/nx-dev/ui/member-card'; + +export function ConfSpeakers(): JSX.Element { + const speakers: Array = [ + { + description: + 'Jeff Cross is a co-founder and Angular consultant at nrwl.io, and is the former tech lead of the Angular Mobile Team at Google.', + imageUrl: '/images/conf/jeff-cross.webp', + name: 'Jeff Cross', + twitter: 'jeffbcross', + }, + { + description: + 'Nrwlio co-founder, ex-Googler. Work on dev tools for TS/JS. Nx and Nx Cloud creator. Calligraphy and philosophy enthusiast. Stoic.', + imageUrl: '/images/conf/victor-savkin.webp', + name: 'Victor Savkin', + twitter: 'victorsavkin', + }, + { + description: 'Coming soon.', + imageUrl: '/images/conf/isaac-mann.webp', + name: 'Isaac Mann', + twitter: 'MannIsaac', + }, + { + description: 'Coming soon.', + imageUrl: '/images/conf/rares-matei.webp', + name: 'Rares Matei', + twitter: '__rares', + }, + { + description: + "Trainer, consultant and programming architect with focus on Angular. Google Developer Expert (GDE) and Trusted Collaborator in the Angular team who writes for O'Reilly, the German Java Magazine, and windows.developer. Regularly speaks at conferences.", + imageUrl: '/images/conf/manfred-steyer.webp', + name: 'Manfred Steyer', + twitter: 'ManfredSteyer', + }, + { + description: + "Diana Rodriguez is a Full Stack Developer & DevOps lover of all things web and cloud! With 20+ years experience and a strong background in back end and infrastructure Diana likes to bring together the best of both worlds. She's super enthusiastic about encouraging people to start a career in development and a fan of Python, IoT, Automation and things to nerd about.", + imageUrl: '/images/conf/diana-rodriguez.webp', + name: 'Diana Rodriguez', + twitter: 'cotufa82', + }, + { + description: + 'James leverages his expert knowledge of Nx to help the biggest enterprises on the planet provide maximum value to their customers. He is a prolific open-source contributor, ESLint Core Team Alum, and has worked on a number of projects alongside the TypeScript Team.', + imageUrl: '/images/conf/james-henry.webp', + name: 'James Henry', + twitter: 'MrJamesHenry', + }, + { + description: + 'Nathan Walker has enjoyed the opportunity to work in the web/mobile app development arena for over 15 years. His varied background rooted in the world of design and the arts provides him a unique approach to problem solving. In 2017, he co-founded nStudio to help work with others to achieve their creative ideas.', + imageUrl: '/images/conf/nathan-walker.webp', + name: 'Nathan Walker', + twitter: 'wwwalkerrun', + }, + ]; + return ( +
+ {speakers.map((speaker) => ( +
+ +
+ ))} +
+ ); +} diff --git a/nx-dev/feature-conf/src/lib/conf-workshop.spec.tsx b/nx-dev/feature-conf/src/lib/conf-workshop.spec.tsx new file mode 100644 index 0000000000..8c3e025b46 --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-workshop.spec.tsx @@ -0,0 +1,9 @@ +import { render } from '@testing-library/react'; +import { ConfWorkshop } from './conf-workshop'; + +describe('ConfWorkshop', () => { + it('should render successfully', () => { + const { baseElement } = render(); + expect(baseElement).toBeTruthy(); + }); +}); diff --git a/nx-dev/feature-conf/src/lib/conf-workshop.tsx b/nx-dev/feature-conf/src/lib/conf-workshop.tsx new file mode 100644 index 0000000000..930e91a94b --- /dev/null +++ b/nx-dev/feature-conf/src/lib/conf-workshop.tsx @@ -0,0 +1,222 @@ +import React from 'react'; +import { MemberCard } from '@nrwl/nx-dev/ui/member-card'; + +export function ConfWorkshop(): JSX.Element { + return ( +
+
+
+ September 14 & 15 +
+

+ Develop at Scale with Nx Monorepos +

+

+ Presented by Nrwl on September 14th and 15th, 10:30am - 5:30pm ET +

+

+ We'll kick off the Nx Conf festivities with a 2-day deep dive into all + things Nx! The Nx Workshop is the official workshop created and + maintained by the Nx Core Team at Nrwl. In these two days, Nrwl + architects will cover the breadth of tools and techniques needed for + any tech lead or individual contributor to be successful working in an + Nx workspace. +

+

+ $800 All-Inclusive +

+

+ Each ticket for the Nx Workshop is $800, and includes both days of the + workshop, as well as a free coupon for the Advanced Nx Workspaces + course on nxplaybook.com, and a gift box to be shipped to you that + includes the coveted "10x Nx Developer" t-shirt. +

+

+ The workshop consists of short presentations, followed by hands-on + codelabs. +

+ +

Day 1

+
    +
  • + + ๐Ÿ”ฌ + {' '} + Lab 1 - Generate an empty workspace +
    • +
  • + + โš—๏ธ + {' '} + Lab 2 - Generate an Angular app +
    • +
  • + + ๐Ÿงช + {' '} + Lab 3 - Executors +
    • +
  • + + ๐Ÿ”ญ + {' '} + Lab 4 - Generate a component lib +
    • +
  • + + ๐Ÿงฌ + {' '} + Lab 5 - Generate a utility lib +
    • +
  • + + ๐Ÿงฎ + {' '} + Lab 6 - Generate a route lib +
    • +
  • + + ๐Ÿค– + {' '} + Lab 7 - Add a NestJS API +
    • +
  • + + ๐Ÿ“ + {' '} + Lab 8 - Displaying a full game in the routed game-detail component +
    • +
  • + + ๐Ÿ’ป + {' '} + Lab 9 - Generate a type lib that the API and frontend can share +
    • +
  • + + ๐Ÿ‘ฉโ€๐Ÿ’ป + {' '} + Lab 10 - Generate Storybook stories for the shared ui component +
    • +
  • + + โŒจ๏ธ + {' '} + Lab 11 - E2E test the shared component +
    • +
+ +

Day 2

+
    +
  • + + ๐Ÿ’ก + {' '} + Lab 12 - Module boundaries +
    • +
  • + + ๐Ÿงธ๏ธ + {' '} + Lab 13 - Workspace Generators - Intro +
    • +
  • + + ๐Ÿงต + {' '} + Lab 14 - Workspace Generators - Modifying files +
    • +
  • + + ๐Ÿ’Ž + {' '} + Lab 15 - Setting up CI +
    • +
  • + + ๐Ÿ”Œ + {' '} + Lab 16 - Distributed caching +
    • +
  • + + ๐Ÿ” + {' '} + Lab 17 - NxCloud GitHub bot +
    • +
  • + + ๐Ÿ“Ž + {' '} + Lab 18 - Run-Commands and deploying the frontend +
    • +
  • Q&A with Jeff Cross, Victor Savkin, Jason Jean, and Jack Hsu
    • +
+
+
+
+

Instructors

+ + +
+
+

What you'll learn

+

+ Weโ€™ll build up a monorepo from scratch, creating a client app and + server app that share an API type library. Weโ€™ll learn how Nx uses + builder commands and schemeatics to make the developer experience + more consistent across projects. Weโ€™ll then make our own builders + and schematics for processes that are unique to our organization. + Weโ€™ll also explore the growing ecosystem of plugins that allow for + the smooth integration of frameworks and libraries. +

+
+ + + +
||
+ + + +
+

+ All codelabs are available in either React or Angular, but the + concepts are the same. +

+
+ +
+
+ ); +} diff --git a/nx-dev/feature-conf/tsconfig.json b/nx-dev/feature-conf/tsconfig.json new file mode 100644 index 0000000000..3230750a88 --- /dev/null +++ b/nx-dev/feature-conf/tsconfig.json @@ -0,0 +1,23 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "jsx": "react-jsx", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + }, + { + "path": "./tsconfig.spec.json" + } + ] +} diff --git a/nx-dev/feature-conf/tsconfig.lib.json b/nx-dev/feature-conf/tsconfig.lib.json new file mode 100644 index 0000000000..71adee65df --- /dev/null +++ b/nx-dev/feature-conf/tsconfig.lib.json @@ -0,0 +1,13 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../dist/out-tsc", + "types": ["node"] + }, + "files": [ + "../../node_modules/@nrwl/react/typings/cssmodule.d.ts", + "../../node_modules/@nrwl/react/typings/image.d.ts" + ], + "exclude": ["**/*.spec.ts", "**/*.spec.tsx"], + "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] +} diff --git a/nx-dev/feature-conf/tsconfig.spec.json b/nx-dev/feature-conf/tsconfig.spec.json new file mode 100644 index 0000000000..559410b96a --- /dev/null +++ b/nx-dev/feature-conf/tsconfig.spec.json @@ -0,0 +1,15 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../dist/out-tsc", + "module": "commonjs", + "types": ["jest", "node"] + }, + "include": [ + "**/*.spec.ts", + "**/*.spec.tsx", + "**/*.spec.js", + "**/*.spec.jsx", + "**/*.d.ts" + ] +} diff --git a/nx-dev/feature-doc-viewer/tsconfig.json b/nx-dev/feature-doc-viewer/tsconfig.json index d5d05866f8..3230750a88 100644 --- a/nx-dev/feature-doc-viewer/tsconfig.json +++ b/nx-dev/feature-doc-viewer/tsconfig.json @@ -1,11 +1,14 @@ { "extends": "../../tsconfig.base.json", "compilerOptions": { - "jsx": "react", + "jsx": "react-jsx", "allowJs": true, "esModuleInterop": true, - "strictNullChecks": true, - "allowSyntheticDefaultImports": true + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true }, "files": [], "include": [], diff --git a/nx-dev/feature-doc-viewer/tsconfig.lib.json b/nx-dev/feature-doc-viewer/tsconfig.lib.json index 655448e740..29ad381b67 100644 --- a/nx-dev/feature-doc-viewer/tsconfig.lib.json +++ b/nx-dev/feature-doc-viewer/tsconfig.lib.json @@ -1,13 +1,13 @@ { "extends": "./tsconfig.json", "compilerOptions": { - "outDir": "../../../dist/out-tsc", + "outDir": "../../dist/out-tsc", "types": ["node"], "lib": ["dom"] }, "files": [ - "../../../node_modules/@nrwl/react/typings/cssmodule.d.ts", - "../../../node_modules/@nrwl/react/typings/image.d.ts" + "../../node_modules/@nrwl/react/typings/cssmodule.d.ts", + "../../node_modules/@nrwl/react/typings/image.d.ts" ], "exclude": ["**/*.spec.ts", "**/*.spec.tsx"], "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] diff --git a/nx-dev/feature-search/tsconfig.json b/nx-dev/feature-search/tsconfig.json index 59b9f4cfe0..3230750a88 100644 --- a/nx-dev/feature-search/tsconfig.json +++ b/nx-dev/feature-search/tsconfig.json @@ -4,8 +4,11 @@ "jsx": "react-jsx", "allowJs": true, "esModuleInterop": true, - "strictNullChecks": true, - "allowSyntheticDefaultImports": true + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true }, "files": [], "include": [], diff --git a/nx-dev/nx-dev/pages/conf.tsx b/nx-dev/nx-dev/pages/conf.tsx index a00cf672d5..aaf28a78db 100644 --- a/nx-dev/nx-dev/pages/conf.tsx +++ b/nx-dev/nx-dev/pages/conf.tsx @@ -1,6 +1,12 @@ import React from 'react'; import Head from 'next/head'; +import Link from 'next/link'; import { Footer, Header } from '@nrwl/nx-dev/ui/common'; +import { + ConfSchedule, + ConfSpeakers, + ConfWorkshop, +} from '@nrwl/nx-dev/feature-conf'; import { useStorage } from '../lib/use-storage'; export function ConfPage() { @@ -66,7 +72,7 @@ export function ConfPage() { "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Crect width='2' height='2' fill='white' fill-opacity='0.15'/%3E%3C/svg%3E\"), linear-gradient(180deg, #143055 0%, #0b1a2d 100%)", }} > - {/*Nx conf*/} + {/*INTRO*/}
@@ -199,7 +205,7 @@ export function ConfPage() {

-
+
Announcing the first ever Nx Conf on{' '} {' '} @@ -332,6 +338,260 @@ export function ConfPage() {

+
+
+ {/*NAVIGATION*/} + {/*
*/} + {/*
*/} + {/*
*/} + {/* */} + {/* */} + {/* Agenda*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* Speakers*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* Workshop*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* Sponsors*/} + {/* */} + {/* */} + {/*
*/} + {/* */} + {/* Register now*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/*
*/} + {/*
*/} + + {/*AGENDA*/} + {/*
*/} + {/*

*/} + {/* Agenda*/} + {/*

*/} + {/* */} + {/*
*/} + + {/*SPEAKERS*/} + {/*
*/} + {/*

*/} + {/* Speakers*/} + {/*

*/} + {/* */} + {/*
*/} + + {/*WORKSHOP*/} +
+

+ Workshop +

+ +
+ + {/*SPONSORS*/} + {/*
*/} + {/*

*/} + {/* Sponsors*/} + {/*

*/} + {/*
*/} + {/*
*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/*
*/} + {/*
*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/*
*/} + {/*
*/} + {/*
*/} +
+