create-react-app/c4f5d8e4.51325823.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[36],{160:function(e,a,t){"use strict";t.r(a);var n=t(0),l=t.n(n),c=t(185),r=t(181),o=t(184),s=t(190),i=t(219),m=t(182),d=t.n(m),u=t(161),p=t.n(u),g=[{title:"Less to Learn",content:"You don't need to learn and configure many build tools. Instant reloads help you focus on development. When it's time to deploy, your bundles are optimized automatically."},{title:"Only One Dependency",content:"Your app only needs one build dependency. We test Create React App to make sure that all of its underlying pieces work together seamlessly \u2013 no complicated version mismatches."},{title:"No Lock-In",content:"Under the hood, we use Webpack, Babel, ESLint, and other amazing projects to power your app. If you ever want an advanced configuration, you can \u201deject\u201d from Create React App and edit their config files directly."}];a.default=function(){var e=Object(r.a)().siteConfig,a=void 0===e?{}:e;return l.a.createElement(s.a,{permalink:"/",description:"Set up a modern web app by running one command."},l.a.createElement("div",{className:d()("hero hero--dark",p.a.heroBanner)},l.a.createElement("div",{className:"container"},l.a.createElement("img",{className:d()(p.a.heroBannerLogo,"margin-vert--md"),src:Object(o.a)("img/logo.svg")}),l.a.createElement("h1",{className:"hero__title"},a.title),l.a.createElement("p",{className:"hero__subtitle"},a.tagline),l.a.createElement("div",{className:p.a.getStarted},l.a.createElement(c.a,{className:"button button--outline button--primary button--lg",to:Object(o.a)("docs/getting-started")},"Get Started")))),g&&g.length&&l.a.createElement("div",{className:p.a.features},l.a.createElement("div",{className:"container"},l.a.createElement("div",{className:"row"},g.map((function(e,a){var t=e.title,n=e.content;return l.a.createElement("div",{key:a,className:d()("col col--4",p.a.feature)},l.a.createElement("h2",null,t),l.a.createElement("p",null,n))}))))),l.a.createElement("div",{className:p.a.gettingStartedSection},l.a.createElement("div",{className:"container padding-vert--xl text--left"},l.a.createElement("div",{className:"row"},l.a.createElement("div",{className:"col col--4 col--offset-1"},l.a.createElement("h2",null,"Get started in seconds"),l.a.createElement("p",null,"Whether you\u2019re using React or another library, Create React App lets you ",l.a.createElement("strong",null,"focus on code, not build tools"),".",l.a.createElement("br",null),l.a.createElement("br",null),"To create a project called ",l.a.createElement("i",null,"my-app"),", run this command:"),l.a.createElement(i.a,{className:"language-sh"},"npx create-react-app my-app"),l.a.createElement("br",null)),l.a.createElement("div",{className:"col col--5 col--offset-1"},l.a.createElement("img",{className:p.a.featureImage,alt:"Easy to get started in seconds",src:"https://camo.githubusercontent.com/29765c4a32f03bd01d44edef1cd674225e3c906b/68747470733a2f2f63646e2e7261776769742e636f6d2f66616365626f6f6b2f6372656174652d72656163742d6170702f323762343261632f73637265656e636173742e737667"}))))),l.a.createElement("div",null,l.a.createElement("div",{className:"container padding-vert--xl text--left"},l.a.createElement("div",{className:"row"},l.a.createElement("div",{className:"col col--4 col--offset-1"},l.a.createElement("img",{className:p.a.featureImage,alt:"Easy to update",src:Object(o.a)("img/update.png")})),l.a.createElement("div",{className:"col col--5 col--offset-1"},l.a.createElement("h2",null,"Easy to Maintain"),l.a.createElement("p",null,"Updating your build tooling is typically a daunting and time-consuming task. When new versions of Create React App are released, you can upgrade using a single command:"),l.a.createElement(i.a,{className:"language-sh"},"npm install react-scripts@latest"))))))}}}]);