Nolra / front_course_2023

charity course
7 stars 0 forks source link

TS intro #36

Open Nolra opened 5 months ago

Nolra commented 5 months ago

Code - https://github.com/Nolra/front_course_2023/tree/ts-intro

https://typescript-exercises.github.io - практика https://tproger.ru/translations/course-on-typescript/ https://typescript-handbook.ru/docs/ts-2

HW: Создайте приложение create-react-app + typescript Приложение должно выводить следующую структуру данных Информацию о пользователе

 const user = {
   name: 'Brad',
   surname: 'Tomik',
   age: 31,
 }

Информацию о погоде

 const weather = {
   light: 'Dark',
   sky: 'Clouds',
   cold: false,
   temperature: 20,
 }

Информацию о городе

 const city = {
   light: 'Ljubljana',
   country: 'Slovenia',
   population: 250000,
   europe: true,
 }

выводите данные на трех разных страницах (/user, weather/, city), реализуйте react router имейте ввиду, что данные могут различаться для тестирования сделайте по два экземпляра данных первый с неверными типами данных второй просто с другими данными

используйте максимально инструментарий типизирования, который вы освоили

1) Для props используйте interface и его расширение (можно сделать так, чтобы страна подставлялась в зависимости от города, для этого можно захардкодить несколько стран-городов в условных операторах) расширяйте интерфейс уже непосредственно на странице /city

2) Используйте типизацию функций как аргументов, так и возвращаемых значений (для этого напишите функцию которая будет принимать name и surname и возвращать полное имя и отображайте fullname)

3) Используйте буквенные типы (условие, чтобы город всегда был в европе), а также комбинирование типов совместно с псевдонимами (europe может быть true или 'yes' и соответственно иметь псевдоним)

nedostatoksna commented 5 months ago

https://github.com/nedostatoksna/ts_homework

NastyaKamalova commented 5 months ago

https://github.com/NastyaKamalova/TS-hw

voidaugust commented 4 months ago

https://github.com/voidaugust/ts-intro /src/pages/user /src/pages/weather /src/pages/city /src/api