Added more content

Author: Vinod Kumar

docs/adoption.md

@@ -1,5 +1,19 @@
 ---
 id: adoption
-title: Adoption guide
+title: Adoption Readiness
 ---
 
+Universal React accelerator has taken several steps to ensure the Adoption Readiness of the tool. 
+
+1. Being used by multiple External and few Internal projects. 
+2. Tested through various sample applications.
+3. Preserves learnings from many successful projects.
+4. Has a Passionate  Core Team to support and enhance it. 
+5. Detailed documentation site & Video Tutorials from developers who worked upon it. 
+
+## Adoption Strategies 
+
+Universal React accelerator can be adopted into your projects in multiple ways. 
+
+1. **Out of the box Adoption**: You can use `npx create-universal-react`to setup your project, if you are completely aligned with [Technology choices](/universal-react-docs/docs/features/). You can make necessary tweaks and adjust these choices post initial setup.
+2. **Clone The Generator**: You can clone the generator, customize it as per your organization needs.

docs/features.md

@@ -1,24 +1,28 @@
 ---
 id: features
-title: Capability Summary 
+title: Features Summary 
 ---
 
+This accelerator is an highly opinionated collection of tools and best practices. It is possible that you have a different take on some of these choices. Feel free to enhance your project post initial setup or clone of this generator to suit your needs. 
+
 ## Ecosystem of this reference architecture generator  🎉
 
-- **Scalable Architecture:** Generate SSG, SSR and Micro-App.
-- **Development Environment:** Monorepo setup along with Storybook integrated for developing and showcasing components.
-- **Micro Frontend:** Develop Micro Frontend architecture with Module Federation.
-- **Static Code Quality checks and formatting:** Javascript and CSS linting using Eslint, StyleLint and Prettier.
-- **Component scaffolding:** Consistently generate components, services and pages using [Generate-Plop](https://github.com/pagesource/component-generator).
-- **Git Hooks:** Pre-commit, Pre-push using Husky.
-- **Testing:** Unit testing with Jest, RTL and Test Cafe for E2E.
-- **Theme and Styling:** with Styled Components.
-- **Next.js:** To develop SSR and SSG with great ease.
-- **PWA:** Develop offline apps or just performant.
-- **Authoring:** Made easy with Markdown-to-JSX.
+- **Development Environment:** Monorepo setup with [Turborepo](https://turborepo.org/).
+- **Next.js:** to develop SSR and SSG with great ease.
+- **Micro Frontend:** architecture with [Module Federation](https://webpack.js.org/concepts/module-federation/).
+- **Component scaffolding:** consistently generate components, services and pages using [Generate-Plop](https://github.com/pagesource/component-generator).
+- **State Management:** lightest state management with Context APi and [Smart-Context](https://www.npmjs.com/package/smart-context).
+- **Remote Data:** change the old way of using Remote Data with [React Query](https://react-query.tanstack.com/).
+- **Unit Testing:** with Jest, [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) and Many custom testing utilities.
+- **End 2 End Testing Automation:** using [Test Cafe](https://testcafe.io/).
+- **Theme and Styling:** with CSS-in-JS using [Stitches](https://stitches.dev/).
+- **Generic Component Library:** with basic building blocks via [Next UI](https://nextui.org/).
+- **Component Browsing:** development and testing with [Storybook](https://storybook.js.org/).
+- **Git Hooks:** to validate changes on Pre-commit, Pre-push using [Husky](https://typicode.github.io/husky/#/).
+- **PWA:** for offline apps using [Workbox](https://developer.chrome.com/docs/workbox/).
+- **Authoring:** made easy with [Markdown-to-JSX](https://www.npmjs.com/package/markdown-to-jsx).
+- **Scaffolding:** of code using [Atomic Design](https://bradfrost.com/blog/post/atomic-web-design/).
+- **Type Safe:** by default using [TypeScript](https://www.typescriptlang.org/).
 - **Mocking:** Mock REST and GraphQl APIs.
 - **Localization:** Switch content based on language preference.
-- **State Management:** Lightest state management with Context APi and [Smart-Context](https://www.npmjs.com/package/smart-context).
-- **Data Fetching:** Change the old way of Data Fetching with [React Query](https://react-query.tanstack.com/).
-- **Type Safe:** TypeScript by Default.
-
+- **Static Code Quality checks and formatting:** Javascript and CSS linting using Eslint, StyleLint and Prettier.

docs/how.md

@@ -1,6 +1,34 @@
 ---
 id: how
-title: How this generator works? 
-sidebar_label: How Universal React works? 
+title: How it works? 
 ---
 
+There are 2 Key Pillars of Universal React.
+
+## 1. Accelerate React Development by instant initial setup
+
+React developers can run `npx create-universal-react` generator for setting up Micro Frontend and SPA architecture with essential tooling instantly.
+## 2. Continuous Improvement and Support via addition of optional features 
+
+React developers can run `npx create-universal-react` generator again for adding on-demand optional features and projects to evolving applications generated with Universal React. 
+
+## Execution flow of generator
+
+Following flow chart explains the workings of generator. 
+
+![Execution flow of Universal React generator](/img/universal-react-generator-2x.png)
+
+## Possible Architecture Overview
+
+Using this generator flow you can setup and evolve a project into following Architecture types. 
+
+![Architecture Types with Universal React generator](/img/universal-react-arch-types-2x.png)
+
+There are 2 ways you can achieve Micro Frontend in this ecosystem. 
+
+1. Micro-App Loader: A small NPM package to load any React micro app or Web Component into a given container. This approach is ideal when:
+    1. You are not loading too many Micro Apps on a page. 
+    2. You don't want to change configurations of Micro App to support Module Federation. 
+2. Module Federation: Multiple separate builds should form a single application. These separate builds should not have dependencies between each other, so they can be developed and deployed individually. Learn more [here](/universal-react-docs/docs/module-federation/).
+
+

docs/what.md

@@ -1,21 +1,21 @@
 ---
 id: why
-title: Why we need this generator? 
+title: Why you need this generator? 
 ---
 
 ## Pain Points of Frontend Development!
 
-1. **Reinventing the wheel** when setting up new projects. 
+1. Reinventing the wheel when setting up new projects. 
 2. Maturity and quality of the solution depends on the architect on the project.
 3. Delays setting up dev eco-systems, quality gates and pipelines.
 4. Overall lack of efficiency, as replication of best practices isn’t easy. 
-
 ## How does Universal React addresses above concerns? 
+1. Instant initial setup of essential solutions for enterprise scale React applications. 
+2. Continuous value addition beyond initial setup through evolving accelerators.
+3. Attention to Developer experience for great productivity.
+4. Preservation and replication of low-level best practices. 
 
-1. Enterprise scale React applications needs a lot more focused solutions. 
-2. Continuous value addition beyond initial setup through accelerators.
-3. Developer experience needs utmost attention for great productivity.
-4. Preservation and replication of low-level best practices is a necessity in era of green teams. 
+## How does Universal React addresses above concerns? 
 
 With **Reuse, Replicate and Reduce**  philosophy at its core Universal React is an accelerator to generate SSR, SSG or Micro-Apps with essential tooling to enable great dev experience and solution quality.
 

docs/why.md

@@ -1,6 +1,6 @@
 module.exports = {
   someSidebar: {
-    Introduction: ['intro', 'why', 'what', 'how', 'road-map', 'contribution', 'adoption', 'support'],
-    Features: ['features', 'quality-control', 'smart-context', 'unit-testing', 'design-system', 'loader', 'web-component', 'logger', 'generate-plop', 'module-federation', 'monorepo', 'storybook'],
+    Introduction: ['intro', 'why', 'how', 'features', 'road-map', 'contribution', 'adoption', 'support'],
+    Features: ['quality-control', 'smart-context', 'unit-testing', 'design-system', 'loader', 'web-component', 'logger', 'generate-plop', 'module-federation', 'monorepo', 'storybook'],
   },
 };