{"id":20091398,"url":"https://github.com/tejasbubane/reactjs-training","last_synced_at":"2026-05-07T17:37:08.378Z","repository":{"id":145488505,"uuid":"166795435","full_name":"tejasbubane/reactjs-training","owner":"tejasbubane","description":"My material for conducting ReactJS training","archived":false,"fork":false,"pushed_at":"2019-01-23T07:57:27.000Z","size":67,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-25T09:51:26.456Z","etag":null,"topics":["es6","reactjs","training"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tejasbubane.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-01-21T10:31:25.000Z","updated_at":"2019-01-23T07:57:29.000Z","dependencies_parsed_at":"2023-03-25T09:30:53.260Z","dependency_job_id":null,"html_url":"https://github.com/tejasbubane/reactjs-training","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/tejasbubane/reactjs-training","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tejasbubane%2Freactjs-training","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tejasbubane%2Freactjs-training/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tejasbubane%2Freactjs-training/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tejasbubane%2Freactjs-training/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tejasbubane","download_url":"https://codeload.github.com/tejasbubane/reactjs-training/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tejasbubane%2Freactjs-training/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259512266,"owners_count":22869377,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["es6","reactjs","training"],"created_at":"2024-11-13T16:31:50.052Z","updated_at":"2026-05-07T17:37:07.064Z","avatar_url":"https://github.com/tejasbubane.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ReactJS Training Material\n\nI conducted [ReactJS](https://reactjs.org/) training at my company [Cybrilla](http://cybrilla.com/).\nThis is my training material.\n\nPlease feel free to reach out to me if you find any errors/inconsistencies.\n\n\n## MERN Training Demo App\n\nProducts portal where users can login, create products and filter them on price-range.\n\n1. Starts with very basic use of react without any build tools\n1. Uses [Webpack](https://webpack.js.org/) with basic handmade easy-to-explain config.\n1. The portal interacts with APIs of nodejs app built in the [node training](https://github.com/tejasbubane/nodejs-training).\n\n### Requirements:\n\n1. Newer version of NodeJS installed. `v8+` should work.\n1. MongoDB installed and running on port `27017`.\n\n\n## Session Outline\n\n### Basics\n\nDuration: 2hrs\n\n* Build basic react hello world app using plain HTML and no build system\n* Live-demo and walkthrough of `counter` and `todoapp` examples in codesandbox - [ref](/basics)\n* Explain [the philosophy of react](react-philosophy.md)\n* Create main app with webpack custom build config and start integration with the node app\n* Toggle between users and products list\n\n### Advanced\n\nDuration: 2hrs\n\n* Introduce React Router\n* Implement login-logout functionality\n* Add price-range filters as slightly advanced example of handling props and routes\n\n_Git commits are tagged at sessions_\n\n## Resources\n\n#### Video Courses (All free)\n\n* [Javscript basics](https://javascript30.com/)\n\n* [The beginner's guide to ReactJS](https://egghead.io/courses/the-beginner-s-guide-to-reactjs)\n\n* [Getting started with Redux](https://egghead.io/courses/getting-started-with-redux)\n\n* [Redux advanced](https://egghead.io/courses/building-react-applications-with-idiomatic-redux)\n\n#### Documentation\n\n* [Learn ES6](https://babeljs.io/learn-es2015/)\n\n* [ReactJS getting started](https://reactjs.org/docs/hello-world.html)\n\n* [Webpack](https://webpack.js.org/concepts/)\n\n* [React Router v4 docs](https://reacttraining.com/react-router/web/)\n\n* [Redux docs](https://redux.js.org/)\n\n#### Few articles worth reading\n\n* [Thinking in React](https://reactjs.org/docs/thinking-in-react.html)\n\n* [WTF is JSX](https://jasonformat.com/wtf-is-jsx/)\n\n### [Project Ideas](/project_ideas.md)\n\n\n\n## Contact\n\n* Email: [my-github-username] [at] gmail [dot] com\n\n* Twitter: [@tejasbubane](https://twitter.com/tejasbubane/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftejasbubane%2Freactjs-training","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftejasbubane%2Freactjs-training","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftejasbubane%2Freactjs-training/lists"}