awesome-cra-v2

My playground on create-react-app v2 with Netlify
https://github.com/willnguyen1312/awesome-cra-v2

Last synced: 2 days ago
JSON representation

Debugging Tests
- Editor Integration
  - Visual Studio Code
- Debugging Tests in Visual Studio Code
  - `launch.json`
Debugging in the Editor
- WebStorm
  - WebStorm - ide-support/hmhgeddbohgjknpmjagkdomcpobmllji) Chrome extension installed.
- Visual Studio Code
  - troubleshooting guide
  - VS Code - for-chrome) installed.
Adding Flow
- Using a Custom Theme
Deployment
- Serving Apps with Client-Side Routing
  - Apache HTTP Server
  - `pushState` history API - router) with `browserHistory`), many static file servers will fail. For example, if you used React Router with a route for `/todos/42`, the development server will respond to `localhost:3000/todos/42` properly, but an Express serving a production build as above will not.
  - `navigateFallback`
- Building for Relative Paths
  - here
- [Azure](https://azure.microsoft.com/)
  - this
  - this - appservice-static) repo for a way to use automatic deployment to Azure App Service.
- [Firebase](https://firebase.google.com/)
- [GitHub Pages](https://pages.github.com/)
- [Heroku](https://www.heroku.com/)
  - Deploying React with Zero Configuration
  - Heroku Buildpack for Create React App
- [Netlify](https://www.netlify.com/)
  - Start a new netlify project
- [Now](https://zeit.co/now)
  - this article.
- [Surge](https://surge.sh/)
  - ensures that every URL falls back to that file
- Customizing Environment Variables for Arbitrary Build Environments
  - env-cmd
- Static Server
  - serve - p` or `--port` flags.
  - Node
- [S3](https://aws.amazon.com/s3) and [CloudFront](https://aws.amazon.com/cloudfront/)
  - blog post
Adding a Stylesheet
- With React Router
  - Webpack
- `Button.js`
  - here
Troubleshooting
- Moment.js locales are missing
  - Moment.js - locale-support).
- `npm test` hangs or crashes on macOS Sierra
  - other installation methods
  - facebook/watchman#358
  - ember-cli/ember-cli#6259
  - Watchman - react-app#713](https://github.com/facebook/create-react-app/issues/713).
  - facebook/jest#1767
- `npm start` doesn’t detect changes
- `npm run build` exits too early
  - adding some swap space
Available Scripts
- `npm start`
  - http://localhost:3000
Adding Bootstrap
- When to Use the `public` Folder
  - reactstrap
- Using a Custom Theme
  - Bootstrap's documentation
Importing a Component
- `DangerButton.js`
  - Understanding ES6: Modules
Analyzing the Bundle Size
- Progressive Web App Metadata
  - Source map explorer
Supported Browsers
- Supported Language Features
Running Tests
- On CI servers
  - Customize your Travis CI Build
  - this article
- Command Line Interface
  - Jest watch mode
- Disabling jsdom
  - `ReactDOM.render()`
- Snapshot Testing
  - Read more about snapshot testing.
- Editor Integration
  - VS Code Jest Preview
- Using Third Party Assertion Libraries
  - file those against Jest - printing React elements as JSX](https://github.com/facebook/jest/pull/1566).
- Testing Components
  - full rendering with `mount()`
  - jest-enzyme - enzyme.
- Configuring the Proxy Manually
  - jsdom
Fetching Data with AJAX Requests
- Adding Development Environment Variables In `.env`
  - here
  - `fetch()` API - US/docs/Web/JavaScript/Reference/Global_Objects/Promise) are available in your target audience's browsers.
  - here - US/docs/Web/JavaScript/Reference/Global_Objects/Promise). Both axios and `fetch()` use Promises under the hood. You can also use the [`async / await`](https://davidwalsh.name/async-await) syntax to reduce the callback nesting.
  - polyfill
  - the FAQ entry on the React website
  - axios - US/docs/Web/API/Fetch_API) provided by the browser.
Using the `public` Folder
- When to Use the `public` Folder
  - `pace.js`
  - `manifest.webmanifest`
Sending Feedback
- your feedback
Syntax Highlighting in the Editor
- Supported Language Features
  - relevant Babel documentation page
Formatting Code Automatically
- WebStorm
Changing the Page `<title>`
- WebStorm
  - `document.title` - helmet), a third party library.
Adding Custom Environment Variables
- Adding Development Environment Variables In `.env`
Can I Use Decorators?
- Adding Development Environment Variables In `.env`
  - decorators
  - #214
  - #411
Proxying API Requests in Development
- "Invalid Host Header" Errors After Configuring Proxy
  - this article - dev-server/issues/887).
  - described here
- API Platform (PHP and Symfony)
  - here’s how to do it for Express
Pre-Rendering into Static HTML Files
- Configuring the Proxy Manually
  - react-snapshot - snap](https://github.com/stereobooster/react-snap) to generate HTML pages for each route, or relative link, in your application. These pages will then seamlessly become active, or “hydrated”, when the JavaScript bundle has loaded.
  - zero-configuration pre-rendering (also called snapshotting) here
Injecting Data from the Server into the Page
- Configuring the Proxy Manually
  - sanitize the JSON before sending it to the client
Advanced Configuration
- [Surge](https://surge.sh/)
Adding a CSS Modules Stylesheet
- `Button.js`
  - here
  - CSS Modules
Post-Processing CSS
- Result
  - `all` property - break-3/#breaking-controls), [custom properties](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables), and [media query ranges](https://www.w3.org/TR/mediaqueries-4/#range-context) are automatically polyfilled to add support for older browsers.
  - CSS Grid Layout
  - Autoprefixer
  - Browserslist specification
  - CSS Grid Layout
  - CSS Grid Layout
Adding a Router
- Using a Custom Theme
  - React Router
  - Basic Example
Integrating with an API Backend
- API Platform (PHP and Symfony)
  - this tutorial
- Node
  - here
  - this tutorial
- Ruby on Rails
  - this tutorial
  - here
Making a Progressive Web App
- Why Opt-in?
- Offline-First Considerations
  - not supported
  - let the user know
- Getting Started with Styleguidist
  - Progressive Web App
Developing Components in Isolation
- Getting Started with Styleguidist
  - GitHub Repo
  - Documentation
- Getting Started with Storybook
  - Snapshot Testing UI
  - GitHub Repo
- Debugging Tests in Visual Studio Code
  - Storybook for React - styleguidist.js.org/) ([source](https://github.com/styleguidist/react-styleguidist)) to your project. **These are third-party tools that let you develop components and see all their states in isolation from your app**.
Publishing Components to npm
- Getting Started with Styleguidist
  - nwb
Displaying Lint Output in the Editor
- Supported Language Features
  - Prettier
Updating to New Releases
- changelog

Programming Languages

JavaScript 10 HTML 6 Shell 1 TypeScript 1

Categories

Deployment 55 Troubleshooting 12 Running Tests 10 Supported Browsers 9 Making a Progressive Web App 7 Post-Processing CSS 6 Fetching Data with AJAX Requests 6 Developing Components in Isolation 5 Integrating with an API Backend 5 Adding Flow 4 Debugging in the Editor 3 Formatting Code Automatically 3 Proxying API Requests in Development 3 Advanced Configuration 3 Can I Use Decorators? 3 Adding Custom Environment Variables 3 Debugging Tests 2 Adding Bootstrap 2 Adding a Router 2 Adding a Stylesheet 2 Pre-Rendering into Static HTML Files 2 Using the `public` Folder 2 Adding a CSS Modules Stylesheet 2 Available Scripts 1 Displaying Lint Output in the Editor 1 Syntax Highlighting in the Editor 1 Injecting Data from the Server into the Page 1 Changing the Page `<title>` 1 Importing a Component 1 Analyzing the Bundle Size 1 Updating to New Releases 1 Publishing Components to npm 1 Sending Feedback 1

Sub Categories

[Firebase](https://firebase.google.com/) 36 Adding Development Environment Variables In `.env` 12 Supported Language Features 11 Using a Custom Theme 7 Result 6 WebStorm 5 `npm start` doesn’t detect changes 5 `npm test` hangs or crashes on macOS Sierra 5 Configuring the Proxy Manually 4 Getting Started with Styleguidist 4 Why Opt-in? 4 [GitHub Pages](https://pages.github.com/) 4 [Surge](https://surge.sh/) 4 When to Use the `public` Folder 3 `Button.js` 3 Serving Apps with Client-Side Routing 3 API Platform (PHP and Symfony) 2 Static Server 2 Visual Studio Code 2 Getting Started with Storybook 2 Debugging Tests in Visual Studio Code 2 Offline-First Considerations 2 On CI servers 2 [Heroku](https://www.heroku.com/) 2 [Azure](https://azure.microsoft.com/) 2 Testing Components 2 Ruby on Rails 2 Editor Integration 2 "Invalid Host Header" Errors After Configuring Proxy 2 Node 2 Snapshot Testing 1 `npm start` 1 With React Router 1 `npm run build` exits too early 1 Progressive Web App Metadata 1 `DangerButton.js` 1 [Netlify](https://www.netlify.com/) 1 Command Line Interface 1 Moment.js locales are missing 1 [Now](https://zeit.co/now) 1 Using Third Party Assertion Libraries 1 Building for Relative Paths 1 [S3](https://aws.amazon.com/s3) and [CloudFront](https://aws.amazon.com/cloudfront/) 1 Customizing Environment Variables for Arbitrary Build Environments 1 Disabling jsdom 1

Keywords

javascript 5 react 3 css 3 nodejs 2 yaml 2 vue 2 typescript 2 scss 2 printer 2 prettier 2 markdown 2 less 2 jsx 2 json 2 dotenv 2 html 2 graphql 2 formatter 2 flow 2 ast 2 angular 2 postcss-plugins 1 prefixer 1 http-client 1 security-tools 1 secrets 1 secret-manager 1 secret-management 1 node 1 environment-variables 1 env 1 configuration-file 1 webpack 1 toolkit 1 react-component 1 preact 1 npm-module 1 karma 1 inferno 1 babel 1 spa 1 heroku-buildpack 1 heroku 1 create-react-app 1 buildpack 1 styleguide 1 documentation 1 promise 1