KO
|
EN
gitlite — search
Search
#typescript
#ai-agents
#deepseek-harness
#dsh-plugin
#open-source
#ai
#cli
#dsh
#claude-code
#codex
#developer-tools
#react
react-tutorial
★ 92
Open GitHub ↗
A react-tutorial
Download README (.md)
Explore Similar Repositories
ngx-youtube-player
:
(ngx) A youtube component wrapped with Angular (typescript)
ansible-prometheus
:
Ansible playbook for installing Prometheus monitoring system, exporters such as: node, snmp, blackbox, thus alert manager and push gateway
ETW2JSON
:
Tool and library to convert ETW logs to JSON files
spaniel
:
LinkedIn's JavaScript viewport tracking library and IntersectionObserver polyfill
Product-Quantization-Tree
:
GPU-based large scale Approx. Nearest Neighbor Search, accepted at CVPR 2016
// repository documentation
Was this content helpful?
★ 0
(0 ratings)
Select Rating:
★
★
★
★
★
Submit Feedback
Recent Feedback
×
Download README
Do you want to download the
README.md
file for
react-tutorial
?
Download (.md)
A (not so simple) React application =================================== This is a central repository that hosts various versions of the react project that correspond to the following articles from http://spapas.github.io/: - http://spapas.github.io/2015/06/05/comprehensive-react-flux-tutorial/ - http://spapas.github.io/2015/07/02/comprehensive-react-flux-tutorial-2/ - http://spapas.github.io/2015/09/08/more-complex-react-flux-example/ - http://spapas.github.io/2016/03/02/react-redux-tutorial/ To be able to follow the articles, I've added a bunch of tags in the repository (they go from the simplest case to the most complex one): - ``react-only``: Use react *only* - ``react-only-validation``: Add validation to the above version - ``react-flux``: Introduce flux to the react-only version - ``react-flux-better-organization``: Improve the code structure by adding modules etc - ``react-flux-complex``: A more complex app with react and flux - ``react-redux``: Use redux with react - ``react-redux-poll-update``: Update UI automatically when there are changes to the data (uses polling) Get code for a tag ------------------ To get the code for a tag, just clone the repository and do a: ``git checkout TAG`` ``python manage.py syncdb`` If you use Django 1.7 or later. ``python manage.py migrate`` ``npm install`` If you want to go to a different tag, you'll just do again a checkout to the corresponding tag and do an ``npm install``, but you'll need to delete the ``db.sqlite3`` file (that contains the database schema for the application) and then do a syncdb again because there may be differences in the database between different tags. Running the application ----------------------- First, you must install required modules. ``pip install -U -r requirements.txt`` Now, to actually run the application, you'll need to use ``python manage.py runserver`` to start the django development server (or run rs.bat/rs.sh depending on your shell). For the ``react-only`` version you can directly modify the js files and see the differences when you refresh the page in your browser. However, for all other versions a node-js toolset with browserify is used to compile the javascript sources to the bundle that is actually used. So, when developing I recommend running ``npm run watch`` to start watchify which automatically re-builds your javascript bundle when it detects a change. Another solution is to run ``npm run build`` that will create a (minified) bundle with the current sources (but will need to be re-run by hand when something in your javascript changes). You can find more info about how I use this node-js toolset (browserify, watchify, uglify, babel etc) @ http://spapas.github.io/2015/05/27/using-browserify-watchify/ for a basic tutorial and @ http://spapas.github.io/2015/11/16/using-browserify-es6/ for how to use ES6.