CI/CD Pipeline with React and Github Action

Learn to initialize a local git repository, stage files with git add, commit changes with a message, and publish to GitHub by creating a repo and pushing.

Learn to deploy a React app to GitHub Pages by installing gh-pages, configuring homepage, adding predeploy and deploy scripts, pushing changes, and running npm run deploy.

Use GitHub action to automate building, testing, and deploying your React app to GitHub Pages across Linux, Windows, and macOS, by creating a YAML workflow that triggers on changes.

Set up a React project quickly with create-react-app, start it with npm start in VS Code, remove unused files, and create a simple Hello World header for bootstrapping next.

Add bootstrap to a React hello world app by wiring bootstrap links into index.html, using fragment, and building a responsive email address and password form for your to-do app.

Create a Bootstrap-styled todo app template by applying a container, grid layout, borders, and a rounded button, with gradient or background image and sans serif typography.

Learn how React state manages component data and updates onChange inputs from a text area, triggering renders and console logging of the input data.

Implement an onSubmit event handler to process form submissions and show the todo item with an alert. Build the list using React state and input data.

Render a dynamic to-do list in React by building a list component, passing items as props, and rendering them with map using bootstrap’s list group.

Add two items to your React to-do list by validating input, appending new items to the list with the spread operator, and updating state to re-render the UI.

Explore passing delete item as a prop to a child component in a React to-do app, using a bootstrap danger button and index-based removal logic.

Learn to implement delete functionality in a React to-do app by filtering out the selected index and updating state with the spread operator, creating a smoother task flow.

Push your code to a GitHub repository to trigger a GitHub Actions workflow that builds and deploys a React app to production via GitHub Pages on push and pull events.