# Modern.js

> The Modern.js framework is a progressive web framework based on React. At ByteDance, we use Modern.js to build upper-level frameworks that have supported the development of thousands of web applications.

## guide

- [BFF](/v2/guides/advanced-features/bff.md)
- [Cross-Project Invocation](/v2/guides/advanced-features/bff/cross-project.md)
- [Extend BFF Server](/v2/guides/advanced-features/bff/extend-server.md)
- [Runtime Framework](/v2/guides/advanced-features/bff/frameworks.md)
- [Basic Usage](/v2/guides/advanced-features/bff/function.md)
- [Extend Request SDK](/v2/guides/advanced-features/bff/sdk.md)
- [File Upload](/v2/guides/advanced-features/bff/upload.md)
- [Improve Build Performance](/v2/guides/advanced-features/build-performance.md)
- [Browser Compatibility](/v2/guides/advanced-features/compatibility.md)
- [Low-Level Tools](/v2/guides/advanced-features/low-level.md)
- [Code Splitting](/v2/guides/advanced-features/page-performance/code-split.md)
- [Inline Static Assets](/v2/guides/advanced-features/page-performance/inline-assets.md)
- [Bundle Size Optimization](/v2/guides/advanced-features/page-performance/optimize-bundle.md)
- [React Compiler](/v2/guides/advanced-features/page-performance/react-compiler.md)
- [Using Rspack](/v2/guides/advanced-features/rspack-start.md)
- [Logs Events](/v2/guides/advanced-features/server-monitor/logger.md)
- [Metrics Events](/v2/guides/advanced-features/server-monitor/metrics.md)
- [Monitors](/v2/guides/advanced-features/server-monitor/monitors.md)
- [Source Code Build Mode](/v2/guides/advanced-features/source-build.md)
- [Custom Web Server](/v2/guides/advanced-features/web-server.md)
- [Path Alias](/v2/guides/basic-features/alias.md)
- [Using CSS-in-JS](/v2/guides/basic-features/css/css-in-js.md)
- [Use CSS Modules](/v2/guides/basic-features/css/css-modules.md)
- [Styling](/v2/guides/basic-features/css/css.md)
- [Using Tailwind CSS](/v2/guides/basic-features/css/tailwindcss.md)
- [Data Caching](/v2/guides/basic-features/data/data-cache.md)
- [Data Fetching](/v2/guides/basic-features/data/data-fetch.md)
- [Data Writing](/v2/guides/basic-features/data/data-write.md)
- [Data Mocking](/v2/guides/basic-features/debug/mock.md)
- [Network Proxy](/v2/guides/basic-features/debug/proxy.md)
- [Using Rsdoctor](/v2/guides/basic-features/debug/rsdoctor.md)
- [Using Storybook](/v2/guides/basic-features/debug/using-storybook.md)
- [Deploy Application](/v2/guides/basic-features/deploy.md)
- [Environment Variables](/v2/guides/basic-features/env-vars.md)
- [HTML Template](/v2/guides/basic-features/html.md)
- [Output Files](/v2/guides/basic-features/output-files.md)
- [Render Preprocessing](/v2/guides/basic-features/render/before-render.md)
- [Static Site Generation](/v2/guides/basic-features/render/ssg.md)
- [Rendering Cache](/v2/guides/basic-features/render/ssr-cache.md)
- [Server-Side Rendering](/v2/guides/basic-features/render/ssr.md)
- [Streaming SSR](/v2/guides/basic-features/render/streaming-ssr.md)
- [Routing](/v2/guides/basic-features/routes.md)
- [Import Static Assets](/v2/guides/basic-features/static-assets.md)
- [Import JSON Files](/v2/guides/basic-features/static-assets/json-files.md)
- [Import SVG Assets](/v2/guides/basic-features/static-assets/svg-assets.md)
- [Import Wasm Assets](/v2/guides/basic-features/static-assets/wasm-assets.md)
- [Cypress](/v2/guides/basic-features/testing/cypress.md)
- [Jest](/v2/guides/basic-features/testing/jest.md)
- [Playwright](/v2/guides/basic-features/testing/playwright.md)
- [Vitest](/v2/guides/basic-features/testing/vitest.md)
- [Build Tool](/v2/guides/concept/builder.md)
- [Page Entry](/v2/guides/concept/entries.md)
- [Web Server](/v2/guides/concept/server.md)
- [Deprecated](/v2/guides/deprecated.md)
- [Glossary](/v2/guides/get-started/glossary.md)
- [Introduction](/v2/guides/get-started/introduction.md)
- [Quick Start](/v2/guides/get-started/quick-start.md)
- [Tech Stack](/v2/guides/get-started/tech-stack.md)
- [Upgrading](/v2/guides/get-started/upgrade.md)
- [Introduction](/v2/guides/topic-detail/micro-frontend/c01-introduction.md)
- [Development](/v2/guides/topic-detail/micro-frontend/c02-development.md)
- [Develop Main App](/v2/guides/topic-detail/micro-frontend/c03-main-app.md)
- [Communicate](/v2/guides/topic-detail/micro-frontend/c04-communicate.md)
- [Mixed Stack](/v2/guides/topic-detail/micro-frontend/c05-mixed-stack.md)
- [Automatically Generated Actions](/v2/guides/topic-detail/model/auto-actions.md)
- [Derived State](/v2/guides/topic-detail/model/computed-state.md)
- [Define a Model](/v2/guides/topic-detail/model/define-model.md)
- [FAQ](/v2/guides/topic-detail/model/faq.md)
- [Management Effect](/v2/guides/topic-detail/model/manage-effects.md)
- [Model Communication](/v2/guides/topic-detail/model/model-communicate.md)
- [Performance Optimization](/v2/guides/topic-detail/model/performance.md)
- [Quick Start](/v2/guides/topic-detail/model/quick-start.md)
- [Redux Ecosystem Integration](/v2/guides/topic-detail/model/redux-integration.md)
- [TS Best Practices](/v2/guides/topic-detail/model/typescript-best-practice.md)
- [Use Models](/v2/guides/topic-detail/model/use-model.md)
- [Using Reduck Separately](/v2/guides/topic-detail/model/use-out-of-modernjs.md)
- [Application-Level Modules](/v2/guides/topic-detail/module-federation/application.md)
- [Deployment](/v2/guides/topic-detail/module-federation/deploy.md)
- [Introduction](/v2/guides/topic-detail/module-federation/introduce.md)
- [Server-Side Rendering](/v2/guides/topic-detail/module-federation/ssr.md)
- [Getting Started](/v2/guides/topic-detail/module-federation/usage.md)
- [Build FAQ](/v2/guides/troubleshooting/builder.md)
- [CLI FAQ](/v2/guides/troubleshooting/cli.md)
- [Dependencies FAQ](/v2/guides/troubleshooting/dependencies.md)
- [HMR FAQ](/v2/guides/troubleshooting/hmr.md)

## configure

- [autoLoadPlugins](/v2/configure/app/auto-load-plugin.md)
- [prefix](/v2/configure/app/bff/prefix.md)
- [builderPlugins](/v2/configure/app/builder-plugins.md)
- [microFrontend](/v2/configure/app/deploy/microFrontend.md)
- [assetPrefix](/v2/configure/app/dev/asset-prefix.md)
- [beforeStartUrl](/v2/configure/app/dev/before-start-url.md)
- [client](/v2/configure/app/dev/client.md)
- [hmr](/v2/configure/app/dev/hmr.md)
- [host](/v2/configure/app/dev/host.md)
- [https](/v2/configure/app/dev/https.md)
- [liveReload](/v2/configure/app/dev/live-reload.md)
- [port](/v2/configure/app/dev/port.md)
- [progressBar](/v2/configure/app/dev/progress-bar.md)
- [proxy](/v2/configure/app/dev/proxy.md)
- [setupMiddlewares](/v2/configure/app/dev/setup-middlewares.md)
- [startUrl](/v2/configure/app/dev/start-url.md)
- [watchFiles](/v2/configure/app/dev/watch-files.md)
- [writeToDisk](/v2/configure/app/dev/write-to-disk.md)
- [lazyCompilation](/v2/configure/app/experiments/lazy-compilation.md)
- [sourceBuild](/v2/configure/app/experiments/source-build.md)
- [appIcon](/v2/configure/app/html/app-icon.md)
- [crossorigin](/v2/configure/app/html/crossorigin.md)
- [disableHtmlFolder](/v2/configure/app/html/disable-html-folder.md)
- [faviconByEntries](/v2/configure/app/html/favicon-by-entries.md)
- [favicon](/v2/configure/app/html/favicon.md)
- [injectByEntries](/v2/configure/app/html/inject-by-entries.md)
- [inject](/v2/configure/app/html/inject.md)
- [metaByEntries](/v2/configure/app/html/meta-by-entries.md)
- [meta](/v2/configure/app/html/meta.md)
- [mountId](/v2/configure/app/html/mount-id.md)
- [outputStructure](/v2/configure/app/html/output-structure.md)
- [scriptLoading](/v2/configure/app/html/script-loading.md)
- [tagsByEntries](/v2/configure/app/html/tags-by-entries.md)
- [tags](/v2/configure/app/html/tags.md)
- [templateByEntries](/v2/configure/app/html/template-by-entries.md)
- [templateParametersByEntries](/v2/configure/app/html/template-parameters-by-entries.md)
- [templateParameters](/v2/configure/app/html/template-parameters.md)
- [template](/v2/configure/app/html/template.md)
- [titleByEntries](/v2/configure/app/html/title-by-entries.md)
- [title](/v2/configure/app/html/title.md)
- [assetPrefix](/v2/configure/app/output/asset-prefix.md)
- [assetsRetry](/v2/configure/app/output/assets-retry.md)
- [charset](/v2/configure/app/output/charset.md)
- [cleanDistPath](/v2/configure/app/output/clean-dist-path.md)
- [convertToRem](/v2/configure/app/output/convert-to-rem.md)
- [copy](/v2/configure/app/output/copy.md)
- [cssModuleLocalIdentName](/v2/configure/app/output/css-module-local-ident-name.md)
- [cssModules](/v2/configure/app/output/css-modules.md)
- [dataUriLimit](/v2/configure/app/output/data-uri-limit.md)
- [disableCssExtract](/v2/configure/app/output/disable-css-extract.md)
- [disableCssModuleExtension](/v2/configure/app/output/disable-css-module-extension.md)
- [disableFilenameHash](/v2/configure/app/output/disable-filename-hash.md)
- [disableInlineRuntimeChunk](/v2/configure/app/output/disable-inline-runtime-chunk.md)
- [disableMinimize](/v2/configure/app/output/disable-minimize.md)
- [disableNodePolyfill](/v2/configure/app/output/disable-node-polyfill.md)
- [disableSourceMap](/v2/configure/app/output/disable-source-map.md)
- [disableSvgr](/v2/configure/app/output/disable-svgr.md)
- [disableTsChecker](/v2/configure/app/output/disable-ts-checker.md)
- [distPath](/v2/configure/app/output/dist-path.md)
- [enableAssetFallback](/v2/configure/app/output/enable-asset-fallback.md)
- [enableAssetManifest](/v2/configure/app/output/enable-asset-manifest.md)
- [enableCssModuleTSDeclaration](/v2/configure/app/output/enable-css-module-tsdeclaration.md)
- [disableInlineRouteManifests](/v2/configure/app/output/enable-inline-route-manifests.md)
- [enableInlineScripts](/v2/configure/app/output/enable-inline-scripts.md)
- [enableInlineStyles](/v2/configure/app/output/enable-inline-styles.md)
- [enableLatestDecorators](/v2/configure/app/output/enable-latest-decorators.md)
- [externals](/v2/configure/app/output/externals.md)
- [filenameHash](/v2/configure/app/output/filename-hash.md)
- [filename](/v2/configure/app/output/filename.md)
- [injectStyles](/v2/configure/app/output/inject-styles.md)
- [inlineScripts](/v2/configure/app/output/inline-scripts.md)
- [inlineStyles](/v2/configure/app/output/inline-styles.md)
- [legalComments](/v2/configure/app/output/legal-comments.md)
- [minify](/v2/configure/app/output/minify.md)
- [overrideBrowserslist](/v2/configure/app/output/override-browserslist.md)
- [polyfill](/v2/configure/app/output/polyfill.md)
- [sourceMap](/v2/configure/app/output/source-map.md)
- [splitRouteChunks](/v2/configure/app/output/split-route-chunks.md)
- [ssg](/v2/configure/app/output/ssg.md)
- [svgDefaultExport](/v2/configure/app/output/svg-default-export.md)
- [tempDir](/v2/configure/app/output/temp-dir.md)
- [buildCache](/v2/configure/app/performance/build-cache.md)
- [bundleAnalyze](/v2/configure/app/performance/bundle-analyze.md)
- [chunkSplit](/v2/configure/app/performance/chunk-split.md)
- [dnsPrefetch](/v2/configure/app/performance/dns-prefetch.md)
- [preconnect](/v2/configure/app/performance/preconnect.md)
- [prefetch](/v2/configure/app/performance/prefetch.md)
- [preload](/v2/configure/app/performance/preload.md)
- [printFileSize](/v2/configure/app/performance/print-file-size.md)
- [profile](/v2/configure/app/performance/profile.md)
- [removeConsole](/v2/configure/app/performance/remove-console.md)
- [removeMomentLocale](/v2/configure/app/performance/remove-moment-locale.md)
- [transformLodash](/v2/configure/app/performance/transform-lodash.md)
- [plugins](/v2/configure/app/plugins.md)
- [Introduce](/v2/configure/app/runtime/0-intro.md)
- [masterApp](/v2/configure/app/runtime/master-app.md)
- [plugins](/v2/configure/app/runtime/plugins.md)
- [router](/v2/configure/app/runtime/router.md)
- [state](/v2/configure/app/runtime/state.md)
- [checkSyntax](/v2/configure/app/security/check-syntax.md)
- [nonce](/v2/configure/app/security/nonce.md)
- [sri](/v2/configure/app/security/sri.md)
- [baseUrl](/v2/configure/app/server/base-url.md)
- [port](/v2/configure/app/server/port.md)
- [publicRoutes](/v2/configure/app/server/public-routes.md)
- [routes](/v2/configure/app/server/routes.md)
- [ssrByEntries](/v2/configure/app/server/ssr-by-entries.md)
- [ssr](/v2/configure/app/server/ssr.md)
- [aliasStrategy](/v2/configure/app/source/alias-strategy.md)
- [alias](/v2/configure/app/source/alias.md)
- [configDir](/v2/configure/app/source/config-dir.md)
- [decorators](/v2/configure/app/source/decorators.md)
- [define](/v2/configure/app/source/define.md)
- [disableDefaultEntries](/v2/configure/app/source/disable-default-entries.md)
- [disableEntryDirs](/v2/configure/app/source/disable-entry-dirs.md)
- [enableAsyncEntry](/v2/configure/app/source/enable-async-entry.md)
- [enableAsyncPreEntry](/v2/configure/app/source/enable-async-pre-entry.md)
- [enableCustomEntry](/v2/configure/app/source/enable-custom-entry.md)
- [entriesDir](/v2/configure/app/source/entries-dir.md)
- [entries](/v2/configure/app/source/entries.md)
- [exclude](/v2/configure/app/source/exclude.md)
- [globalVars](/v2/configure/app/source/global-vars.md)
- [include](/v2/configure/app/source/include.md)
- [mainEntryName](/v2/configure/app/source/main-entry-name.md)
- [moduleScopes](/v2/configure/app/source/module-scopes.md)
- [preEntry](/v2/configure/app/source/pre-entry.md)
- [resolveExtensionPrefix](/v2/configure/app/source/resolve-extension-prefix.md)
- [resolveMainFields](/v2/configure/app/source/resolve-main-fields.md)
- [transformImport](/v2/configure/app/source/transform-import.md)
- [autoprefixer](/v2/configure/app/tools/autoprefixer.md)
- [babel](/v2/configure/app/tools/babel.md)
- [bundlerChain](/v2/configure/app/tools/bundler-chain.md)
- [cssExtract](/v2/configure/app/tools/css-extract.md)
- [cssLoader](/v2/configure/app/tools/css-loader.md)
- [devServer](/v2/configure/app/tools/dev-server.md)
- [esbuild](/v2/configure/app/tools/esbuild.md)
- [htmlPlugin](/v2/configure/app/tools/html-plugin.md)
- [less](/v2/configure/app/tools/less.md)
- [lightningcssLoader](/v2/configure/app/tools/lightningcss-loader.md)
- [minifyCss](/v2/configure/app/tools/minify-css.md)
- [postcss](/v2/configure/app/tools/postcss.md)
- [pug](/v2/configure/app/tools/pug.md)
- [rspack](/v2/configure/app/tools/rspack.md)
- [sass](/v2/configure/app/tools/sass.md)
- [styleLoader](/v2/configure/app/tools/style-loader.md)
- [styledComponents](/v2/configure/app/tools/styled-components.md)
- [swc](/v2/configure/app/tools/swc.md)
- [tailwindcss](/v2/configure/app/tools/tailwindcss.md)
- [terser](/v2/configure/app/tools/terser.md)
- [tsChecker](/v2/configure/app/tools/ts-checker.md)
- [tsLoader](/v2/configure/app/tools/ts-loader.md)
- [webpackChain](/v2/configure/app/tools/webpack-chain.md)
- [webpack](/v2/configure/app/tools/webpack.md)
- [Configuration](/v2/configure/app/usage.md)

## plugin-menu

- [CLI Plugin API](/v2/plugin/cli-plugins/api.md)
- [Life Cycle](/v2/plugin/cli-plugins/life-cycle.md)
- [Plugin Migration](/v2/plugin/cli-plugins/migration.md)
- [Introduction](/v2/plugin/introduction.md)
- [Overview](/v2/plugin/official/cli-plugins.md)
- [BFF Plugin](/v2/plugin/official/cli-plugins/plugin-bff.md)
- [SSG Plugin](/v2/plugin/official/cli-plugins/plugin-ssg.md)
- [SWC Plugin](/v2/plugin/official/cli-plugins/plugin-swc.md)
- [Tailwind CSS Plugin](/v2/plugin/official/cli-plugins/plugin-tailwind.md)
- [Overview](/v2/plugin/official/rsbuild-plugins.md)
- [Esbuild Plugin](/v2/plugin/official/rsbuild-plugins/plugin-esbuild.md)
- [Plugin System](/v2/plugin/plugin-system.md)
- [Plugin API](/v2/plugin/runtime-plugins/api.md)
- [Life Cycle](/v2/plugin/runtime-plugins/life-cycle.md)
- [Plugin Migration](/v2/plugin/runtime-plugins/migration.md)
- [Plugin API](/v2/plugin/server-plugins/api.md)
- [Life Cycle](/v2/plugin/server-plugins/life-cycle.md)

## apis

- [Commands](/v2/apis/app/commands.md)
- [lambda/*.[tj]s](/v2/apis/app/hooks/api/lambda.md)
- [favicon.*](/v2/apis/app/hooks/config/favicon.md)
- [html/](/v2/apis/app/hooks/config/html.md)
- [icon.*](/v2/apis/app/hooks/config/icon.md)
- [mock/](/v2/apis/app/hooks/config/mock.md)
- [public/](/v2/apis/app/hooks/config/public.md)
- [upload/](/v2/apis/app/hooks/config/upload.md)
- [modern.config.[tj]s](/v2/apis/app/hooks/modern-config.md)
- [index.[tj]s](/v2/apis/app/hooks/server/index_.md)
- [modern.server.[tj]s](/v2/apis/app/hooks/server/server.md)
- [shared/](/v2/apis/app/hooks/shared.md)
- [App.[tj]sx](/v2/apis/app/hooks/src/app.md)
- [entry.[tj]s](/v2/apis/app/hooks/src/entry.md)
- [entry.server.[tj]sx](/v2/apis/app/hooks/src/entry.server.md)
- [index.[tj]s](/v2/apis/app/hooks/src/index_.md)
- [modern.runtime.[tj]s](/v2/apis/app/hooks/src/modern.runtime.md)
- [routes/](/v2/apis/app/hooks/src/routes.md)
- [*.[server|node].[tj]sx](/v2/apis/app/hooks/src/server.md)
- [**/*.stories.[tj]sx](/v2/apis/app/hooks/src/stories.md)
- [defineConfig](/v2/apis/app/runtime/app/define-config.md)
- [useHonoContext](/v2/apis/app/runtime/bff/use-hono-context.md)
- [bootstrap](/v2/apis/app/runtime/core/bootstrap.md)
- [createApp](/v2/apis/app/runtime/core/create-app.md)
- [createRoot](/v2/apis/app/runtime/core/create-root.md)
- [render](/v2/apis/app/runtime/core/render.md)
- [useLoader](/v2/apis/app/runtime/core/use-loader.md)
- [useModuleApps](/v2/apis/app/runtime/core/use-module-apps.md)
- [useRuntimeContext](/v2/apis/app/runtime/core/use-runtime-context.md)
- [Provider](/v2/apis/app/runtime/model/Provider.md)
- [Auto actions](/v2/apis/app/runtime/model/auto-actions.md)
- [connect](/v2/apis/app/runtime/model/connect.md)
- [createApp](/v2/apis/app/runtime/model/create-app.md)
- [createStore](/v2/apis/app/runtime/model/create-store.md)
- [handleEffect](/v2/apis/app/runtime/model/handle-effect.md)
- [model](/v2/apis/app/runtime/model/model_.md)
- [useLocalModel](/v2/apis/app/runtime/model/use-local-model.md)
- [useModel](/v2/apis/app/runtime/model/use-model.md)
- [useStaticModel](/v2/apis/app/runtime/model/use-static-model.md)
- [useStore](/v2/apis/app/runtime/model/use-store.md)
- [router](/v2/apis/app/runtime/router/router.md)
- [NoSSR](/v2/apis/app/runtime/ssr/no-ssr.md)
- [PreRender](/v2/apis/app/runtime/ssr/pre-render.md)
- [renderStreaming](/v2/apis/app/runtime/ssr/renderStreaming.md)
- [renderString](/v2/apis/app/runtime/ssr/renderString.md)
- [createRequestHandler](/v2/apis/app/runtime/ssr/requestHandler.md)
- [CSS-In-JS API](/v2/apis/app/runtime/utility/css-in-js.md)
- [Head](/v2/apis/app/runtime/utility/head.md)
- [loadable](/v2/apis/app/runtime/utility/loadable.md)
- [Hook](/v2/apis/app/runtime/web-server/hook.md)
- [Middleware](/v2/apis/app/runtime/web-server/middleware.md)
- [Unstable Middleware](/v2/apis/app/runtime/web-server/unstable_middleware.md)

## tutorials

- [Route Authorization](/v2/tutorials/examples/csr-auth.md)
- [Create Project](/v2/tutorials/first-app/c01-start.md)
- [Add UI Components](/v2/tutorials/first-app/c02-component.md)
- [Add Style](/v2/tutorials/first-app/c03-css.md)
- [Add Client Route](/v2/tutorials/first-app/c04-routes.md)
- [Add Loader](/v2/tutorials/first-app/c05-loader.md)
- [Add Model](/v2/tutorials/first-app/c06-model.md)
- [Add Container](/v2/tutorials/first-app/c07-container.md)
- [Add Application Entry](/v2/tutorials/first-app/c08-entries.md)
- [Introduction](/v2/tutorials/foundations/introduction.md)

## community

- [2022 年 7 ~ 8 月更新内容](/v2/community/blog/2022-0708-updates.md)
- [2022 年 9 ~ 10 月更新内容](/v2/community/blog/2022-0910-updates.md)
- [Overview](/v2/community/blog/overview.md)
- [Modern.js v2 发布](/v2/community/blog/v2-release-note.md)
- [Contributing Guide](/v2/community/contributing-guide.md)
- [Releases](/v2/community/releases.md)
- [Showcase](/v2/community/showcase.md)
- [Meet the Team](/v2/community/team.md)

## Other

- [Modern.js - A Progressive React Framework for modern web development](/v2/index.md)