shangan23 / react-js

React Learnings - Navigate to `src` folder to see examples.

React

React Learnings by example

How to run examples?

• The repository has src folder in which the examples files are present. To execute the code the example file need to be renamed to index.js and it has to be directly under src directory. This repository is just for learning purpose.

Here's what each package does:

• react: UI library for creating modular components
• react-dom: enables us to render the React within the browser DOM
• webpack: bundler that converts your source code into production-ready output
• webpack-cli: allows webpack to work with CLI commands
• webpack-dev-server: transforms our source code and serves it on a web server as we develop it continuously. This helps use see the output of your code in the browser.
• html-webpack-plugin: an extension to webpack that adds the basic index html file
• @babel/core: a JavaScript transpiler to converts modern JavaScript into a production-ready version that's compatible with all browsers.
• babel-loader: connects Babel to webpack's build process
• @babel/preset-env: group of commonly used Babel plugins bundled into a preset that converts modern JavaScript features into widely compatible syntax
• @babel/preset-react: React-specific Babel plugins that convert JSX syntax into plain old JavaScript that browsers can understand

Quick note: --save-dev flag is for partitioning the dependencies into development-specific dependencies, so that they are not included in the production JavaScript bundle

react-js's Issues

Example on useEffect hook

Controlled component by example

Controlled Input component

React - Class lifecycle hook

React - Class lifecycle hook

Example on useReducer hook

Example on useReducer hook

PropTypes with isRequired

PropTypes with isRequired by example

Github file list example

Github file list by example

Readme update

Readme update

Component communication by example

Component communication by example

React base setup

React base setup

Axios api by example

Axios api by example

Proptypes custom validation

Proptypes custom validation by example

create DOM with createElement and JSX

sample for create DOM with createElement and JSX