44 Beginner Examples
react faq: Tight, curated FAQ's about React. Static site built with GatsbyJS, react-router, Netlify, Algolia. Nice layout and typography. Content in Github.
S3 Infrequent Access Calculator: Calculate S3 costs between Standard vs Infrequent Access buckets. Uses react-bootstrap, stateless components.
mastermind tight: Mastermind game in 360 lines, with detailed blog. Good intro to React, ES6.
yelp clone: Tutorial: Build a Yelp-clone in React. Starts from scratch with mkdir. Tested with Enzyme.
Github Card: Displays Github card using Fetch, Github API
bmi calc: Uses elegant mouse dragging to input numbers.
react fundamentals: From 'React Fundamentals' course. Uses Axios, react-router, OpenWeatherMap.
Productive in React: Great intro to React, full of CodePen examples. Covers props, state, event handlers.
react chronometer: A simple chronometer, accurate to 1/100th second. Has Start/Stop/Reset.
Chartist codepen: Charts with Chartist- SVG, responsive. Uses Modernizr to detect SVG support.
Visualising a tree structure: Blog about writing a tree control-Redux/ImmutableJS for high-performance updating.
shirt sizes: Redux example- action fetches data asynch, uses redux-thunk.
react thermometer: Simple thermometer widget, good for dashboards.
Github card Codepen: Github user cards fetching data from the Github API, 125 lines.
codepen Calculator: Uses event emitter, flux-like store.
Baby name inspiration: Beginner example filtering a list of names in real-time.
react dilutioncalc: Editor example for dilutions. Has cross-linked edit fields, buttons.
redux pokedex: Simple Pokedex app to start learning Redux
React RxJS: RxJS as a replacement to flux- uses Rx.Subject
mailbox: Example of a three-level Gmail-like email client.
WRDebug (Browser Only)
: ✅ Pre-render cache hit. |