https://github.com/frnt-end/react-typescript-context

⚛️ REACT & TYPESCRIPT Project using CONTEXT. In this app you will be creating 5 team members profiles cards using a form, Watch DEMO 🔥 https://frnt-end.github.io/React-Typescript-Context 👈
https://github.com/frnt-end/react-typescript-context

app cards context create dynamic engineer form frontend gh-pages global-state hooks list radio-buttons react reactjs state-management typescript ui users web-design

Last synced: 16 days ago
JSON representation

⚛️ REACT & TYPESCRIPT Project using CONTEXT. In this app you will be creating 5 team members profiles cards using a form, Watch DEMO 🔥 https://frnt-end.github.io/React-Typescript-Context 👈

• Host: GitHub
• URL: https://github.com/frnt-end/react-typescript-context
• Owner: Frnt-End
• Created: 2021-12-26T16:22:22.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-02-14T22:12:15.000Z (about 3 years ago)
• Last Synced: 2025-06-13T11:07:24.639Z (11 months ago)
• Topics: app, cards, context, create, dynamic, engineer, form, frontend, gh-pages, global-state, hooks, list, radio-buttons, react, reactjs, state-management, typescript, ui, users, web-design
• Language: CSS
• Homepage: https://frnt-end.github.io/React-Typescript-Context/
• Size: 5.68 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 'Create Your Winning Team' App

Creating members profiles cards using React, Typescript & Context Hook.

In this app you will be creating your Top-5 Elite Team using a form.

👉 [Watch DEMO](https://frnt-end.github.io/React-Typescript-Context/)

![Create List Form](src/Img/bg-small.png "Create List Form")

## Project Architecture

- **React** and **Typescript** app.

- Using **useEffect** and **useState** hooks.

- Global state managmaent using **context**.

## UI

- Choosing profile images using **radio buttons**.

- **CSS** hover effects and transitions.

- **Responsive**.

## Local View

In your fav IDE: navigate to the main folder and type in the terminal:

##### `npm start` or `yarn start`

👉 [Online DEMO](https://frnt-end.github.io/React-Typescript-Context/)

---

Enjoy using the app..😉

---

### License

Copyright © 2019 @frnt-end

[Portfolio Website](https://frnt-end.github.io/portfolio/)

[![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)