ChatGPT coding: ️React  banking card selection with Material UI Radio buttons

ChatGPT coding: ️React banking card selection with Material UI Radio buttons

Vincent Vauban

54 года назад

99 Просмотров

Let's chaGPT code a React app displaying Payment card network selection.

This will be done in React and the Material UI lib.

0:00 intro
0:10 Radio buttons With Material UI
0:26 chatGPT prepared code
0:43 chatGPT 'male a React app'
1:20 Creating React App
1:58 Installing Material UI
2:43 Starting the app
3:00 Creating the CardNetworkSelection component
4:10 Result: Card networks radio appearing
4:24 Replacing Radio labels with pictures
6:43 Resizing pictures
7:22 Inlining radio buttons
8:33 Changing radio button color
10:44 Final words
11:12 Code explanation
12:14 Thanks


Cards pictures:
https://www.smashingmagazine.com/2010/10/free-png-credit-card-debit-card-and-payment-icons-set-18-icons/

Used ChatGPT Q/A:
https://chat.openai.com/share/40b77813-50d3-4cf7-8c7b-427c35323ebf

GitHub::
https://github.com/vinny59200/vv-react-mui-radio.git

React Udemy interview prep:
https://www.udemy.com/course/react-reactjs-questions-and-answers-2023-job-interviews/?referralCode=C52F8C70EFA5555C18AC
Ссылки и html тэги не поддерживаются


Комментарии: