Skip to content

Commit

Permalink
Add React to update folder (#2202)
Browse files Browse the repository at this point in the history
  • Loading branch information
flashdesignory authored Sep 29, 2023
1 parent e9d9ae8 commit 0477425
Show file tree
Hide file tree
Showing 27 changed files with 16,645 additions and 17 deletions.
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ <h2>Examples</h2>
<a href="examples/polymer/index.html" data-source="http://polymer-project.org" data-content="Polymer is a new type of library for the web, built on top of Web Components, and designed to leverage the evolving web platform on modern browsers. It is comprised of core platform features (e.g Shadow DOM, Custom Elements, MDV) enabled with polyfills and a next generation web application framework built on these technologies.">Polymer</a>
</li>
<li class="routing">
<a href="examples/react/" data-source="http://facebook.github.io/react/" data-content="React is a JavaScript library for building user interfaces.">React</a>
<a href="updates/react/dist/" data-source="http://facebook.github.io/react/" data-content="React is a JavaScript library for building user interfaces.">React</a>
</li>
<li class="routing">
<a href="examples/react-redux/dist" data-source="https://react-redux.js.org/" data-content="React Redux is maintained by the Redux team, and kept up-to-date with the latest APIs from Redux and React.">React Redux</a>
Expand Down
26 changes: 10 additions & 16 deletions learn.json
Original file line number Diff line number Diff line change
Expand Up @@ -1500,8 +1500,8 @@
"description": "React is a JavaScript library for creating user interfaces. Its core principles are declarative code, efficiency, and flexibility. Simply specify what your component looks like and React will keep it up-to-date when the underlying data changes.",
"homepage": "facebook.github.io/react",
"examples": [{
"name": "Example",
"url": "examples/react"
"name": "React",
"url": "updates/react/dist"
}, {
"name": "React + Backbone.js",
"url": "examples/react-backbone"
Expand All @@ -1518,29 +1518,23 @@
"link_groups": [{
"heading": "Official Resources",
"links": [{
"name": "Tutorial",
"url": "http://facebook.github.io/react/docs/tutorial.html"
"name": "Quick Start",
"url": "https://react.dev/learn"
}, {
"name": "API Reference",
"url": "https://react.dev/reference/react"
},{
"name": "Philosophy",
"url": "http://www.quora.com/Pete-Hunt/Posts/React-Under-the-Hood"
}, {
"name": "Support",
"url": "http://facebook.github.io/react/support.html"
"url": "https://petehuntsposts.quora.com/React-Under-the-Hood"
}, {
"name": "Flux architecture example",
"url": "https://github.com/facebook/flux/tree/master/examples/flux-todomvc"
"name": "React Community",
"url": "https://react.dev/community"
}]
}, {
"heading": "Community",
"links": [{
"name": "ReactJS on Stack Overflow",
"url": "https://stackoverflow.com/questions/tagged/reactjs"
}, {
"name": "Google Groups Mailing List",
"url": "https://groups.google.com/group/reactjs"
}, {
"name": "IRC",
"url": "irc://chat.freenode.net/reactjs"
}]
}]
},
Expand Down
13 changes: 13 additions & 0 deletions updates/react/.eslintrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"extends": ["eslint:recommended", "plugin:react/recommended"],
"settings": {
"react": {
"version": "17.0.2"
}
},
"rules": {
"no-extra-parens": 0,
"react/prop-types": 0,
"react/react-in-jsx-scope": 0
}
}
2 changes: 2 additions & 0 deletions updates/react/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
.DS_Store
/node_modules
42 changes: 42 additions & 0 deletions updates/react/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
# TodoMVC: React Hooks

## Description

This application uses React 17.0.2 to implement a todo application.

- [React](https://reactjs.org/) is a JavaScript library for creating user interfaces.

## Implementation details

React focuses mainly on providing composable user interfaces to enable developers to build an appealing website or web app. React does not force the user to utilize a particular design pattern, but it does provide useful hooks to implement an MVC pattern, if desired.

React:\
Model: Todo reducer (reducer.js)\
View: React ui components\
Controller: App component + useReducer hook

MVC:\
Model: Maintains the data and behavior of an application\
View: Displays the model in the ui\
Controller: Serves as an interface between view & model components

## Build steps

To build the static files, this application utilizes webpack. It minifies and optimizes output files and copies all necessary files to a `dist` folder.

## Requirements

The only requirement is an installation of Node, to be able to install dependencies and run scripts to serve a local server.

```
* Node (min version: 18.13.0)
* NPM (min version: 8.19.3)
```

## Local preview

```
terminal:
1. npm install
2. npm run start
```
3 changes: 3 additions & 0 deletions updates/react/dist/app.bundle.js

Large diffs are not rendered by default.

69 changes: 69 additions & 0 deletions updates/react/dist/app.bundle.js.LICENSE.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/

/*!
Copyright (c) 2018 Jed Watson.
Licensed under the MIT License (MIT), see
http://jedwatson.github.io/classnames
*/

/**
* @remix-run/router v1.3.3
*
* Copyright (c) Remix Software Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE.md file in the root directory of this source tree.
*
* @license MIT
*/

/**
* React Router v6.8.2
*
* Copyright (c) Remix Software Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE.md file in the root directory of this source tree.
*
* @license MIT
*/

/** @license React v0.20.2
* scheduler.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

/** @license React v17.0.2
* react-dom.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

/** @license React v17.0.2
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

/** @license React v17.0.2
* react.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
1 change: 1 addition & 0 deletions updates/react/dist/app.bundle.js.map

Large diffs are not rendered by default.

2 changes: 2 additions & 0 deletions updates/react/dist/app.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 0477425

Please sign in to comment.