Начинаем программировать #2
Conversation
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
src/pages/main-page/main-page.tsx
Outdated
| <section className="cities__places places"> | ||
| <h2 className="visually-hidden">Places</h2> | ||
| <b className="places__found">312 places to stay in Amsterdam</b> | ||
| <form className="places__sorting" action="#" method="get"> |
There was a problem hiding this comment.
Форму в принципе тоже можно вынести отдельно)
src/pages/main-page/main-page.tsx
Outdated
| function MainPage({ rentalOffersCount }: MainPageProps): JSX.Element { | ||
| const cards = Array.from({ length: rentalOffersCount }, (_, i) => ( | ||
| <Card key={i} isPremium pageType={PageType.MAIN} /> | ||
| )); |
There was a problem hiding this comment.
Карточки (сам список с маппингом карточек внутри) тоже хорошо подходят на роль компонента)
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
|
Ваш пулреквест опубликован. Посмотреть можно здесь |
There was a problem hiding this comment.
Обрати внимание на название директории src/pages/offer — не выполнен Б22. Главный файл в каждой директории, называется так же, как директория, например app/app.tsx или index.ts (если используется реэкспорт).
В остальном отличная работа! 🔥
| }; | ||
|
|
||
| function LocationsList({ locations }: LocationsProps): JSX.Element { | ||
| const items = Array.from({ length: locations.length }, (_, i) => ( |
There was a problem hiding this comment.
Может быть, просто итерироваться по массиву locations с помощью метода .map()?
| width={width} | ||
| height={height} | ||
| /> | ||
| </a> |
There was a problem hiding this comment.
Не надо добавлять условие, оставь просто то, что во втором return, с ссылкой.
| }; | ||
|
|
||
| function Map({ className }: MapProps): JSX.Element { | ||
| return <section className={`${className} map`}></section>; |
There was a problem hiding this comment.
<section className={${className} map} />
| const HeaderLogoValue = { | ||
| className: 'header__logo-link', | ||
| width: 81, | ||
| height: 41, |
There was a problem hiding this comment.
Б9. Перечисления (Enum) названы английскими существительными и начинаются с прописной (заглавной) буквы
Обрати внимание на написание внутренних свойств:
// С использованием `enum`
enum View {
Artist = 'Artist',
Genre = 'Genre',
}
// Константный объект
const EndGameType = {
Lives: 'lives',
Quest: 'quests',
} as const;
| const DEFAULT_ACTIVE_LOCATION = LOCATIONS[0]; | ||
|
|
||
| const TypesPage = { | ||
| MAIN: 'cities', |
There was a problem hiding this comment.
И тут обрати внимание на именование, критерий Б9.
| </div> | ||
| </div> | ||
| </div> | ||
| </header> |
There was a problem hiding this comment.
Тут вынести в отдельный компонент)
| <a className="locations__item-link" href="#"> | ||
| <span>Amsterdam</span> | ||
| </a> | ||
| </div> */} |
| <div className="cities__places-container container"> | ||
| <section className="cities__places places"> | ||
| <h2 className="visually-hidden">Places</h2> | ||
| <b className="places__found">312 places to stay in Amsterdam</b> |
There was a problem hiding this comment.
Доделать пункт 7 задания:
теперь, используя props, добавим динамики в компоненты. Для этого в компоненте главной страницы приложения определите изменяемые данные — это будет количество предложений аренды. Получите их из props и вставьте в JSX компонента.
| /> | ||
| </div> | ||
| </div> | ||
| </header> |
There was a problem hiding this comment.
Переиспользовать компонент Header
| <li className="offer__inside-item">Dishwasher</li> | ||
| <li className="offer__inside-item">Cabel TV</li> | ||
| <li className="offer__inside-item">Fridge</li> | ||
| </ul> |
There was a problem hiding this comment.
Тоже можно вынести в компоненты списка и Item.
🎓 Начинаем программировать