[Разработка веб-сайтов, JavaScript, Программирование, ReactJS] Делаем интерактивный Big Mac Index на React и Quarkly
Автор
Сообщение
news_bot ®
Стаж: 6 лет 9 месяцев
Сообщений: 27286
Привет! Для начала процитирую страницу из Википедии, да будет здоров Джимми Уэйлс и все редакторы, поддерживающие свободную энциклопедию. Согласно ней, индекс бигмака — это неофициальный способ определения паритета покупательной способности. Если проще, этот индекс довольно наглядно показывает уровень цен в стране, ведь в основе стоимости бигмака: две мясных котлеты гриль, специальный соус, сыр, огурцы, салат и лук, всё на булочке с кунжутом… Кроме этого, конечно же, в ценник заложены аренда помещений и оборудования, рабочая сила и многие другие факторы.
Важно и другое: милые сердцу многих рестораны с желтой буквой «M» имеют обширнейшую сеть, что дает возможность сравнить цены почти по всему миру. Исследования ведутся с 1986 года и постоянно актуализируются журналом «The Economist».
Мы визуализировали имеющиеся в свободном доступе данные и собрали простое приложение, используя React и наш проект Quarkly.
Пост получился бы менее интересным без технической части, хотя поиграться с числами и посмотреть, сколько бигмаков вы могли себе позволить несколько лет назад на свою зарплату в Израиле или, например, во Вьетнаме, путешествуя как настоящий кочевник, тоже интересно.
Не агитируем брать валютные ипотеки, ориентируясь на индекс бигмака (к слову, в странах Африки есть ещё и индекс KFC), наш пост чуть об ином. Основной нашей задачей было посмотреть на практике, насколько просто и быстро получится реализовать подобную задумку, работая лишь в одном инструменте. Коротко про человекочасы — в самом конце поста.
Часть 1. Пишем код компонента с нуля
Записали видео всего процесса с русскими и английскими субтитрами. В описании есть таймкоды, чтобы сэкономить время и посмотреть только то, что вам интересно.
Извините, данный ресурс не поддреживается. :(
Всю кодовую часть пишем внутри Quarkly.io, используя хуки. Данные подтягиваем из базы, которая есть в свободном доступе на гитхабе.
Часть 2. Настраиваем визуал приложения
Прелесть в том, что для этого нам не нужно переключаться на другой инструмент и продумывать логики того, как связать наш код и дизайн.
В Quarkly всё уже находится под рукой.
Извините, данный ресурс не поддреживается. :(
Начинать стилизацию не нужно с чистого листа, поскольку структура и логики уже были созданы на предыдущем этапе. Это сильно экономит время.
Смотрим на результат
Приложение доступно по ссылке bigmaconomics.com.
На всю работу с учетом написания кода компонента и последующей донастройки визуала ушло около 15 часов с перерывами, поделившими процесс на два дня. Вероятно, можно было управиться быстрее, но такой задачи изначально не стояло. Было интересно понять, насколько проект подходит для практического решения подобной задачи в целом.
Приглашаем в наше комьюнити Quarkly в телеграме, где мы делимся новостями про апдейты и отвечаем на вопросы.
===========
Источник:
habr.com
===========
Похожие новости:
- [Разработка веб-сайтов, JavaScript, Программирование, HTML] Фреймворк Webix Jet глазами новичка. Часть 1. Композиция и навигация
- [Open source, Программирование микроконтроллеров, DIY или Сделай сам] USB Host, «Blue Pill», метод деления отрезка пополам и цена на водку в СССР
- [Программирование, Разработка мобильных приложений, Разработка под Android] 0x7E5 Рассуждения о главном
- [Программирование, Алгоритмы, C] Разбиваем строку на подстроки по разделяющим символам своими руками
- [Python, Программирование] Pattern matching. Теперь и в Python
- [Python, Программирование, Машинное обучение] Поиск нарушений на видео с помощью компьютерного зрения
- [Программирование, *nix, Учебный процесс в IT, Карьера в IT-индустрии] Полезные материалы для разработчика
- [JavaScript, Совершенный код, Интерфейсы, Функциональное программирование] Шпаргалка по функциональному программированию
- [Программирование, ERP-системы, Управление персоналом, Читальный зал, 1С] Помолчи-ка, программист
- [Разработка веб-сайтов, JavaScript] Юридически значимый электронный документ (для РК) из веб формы без серверного кода
Теги для поиска: #_razrabotka_vebsajtov (Разработка веб-сайтов), #_javascript, #_programmirovanie (Программирование), #_reactjs, #_big_mac_index, #_react, #_sozdanie_vebprilozhenij (создание веб-приложений), #_quarkly, #_instrumenty_razrabotki (инструменты разработки), #_blog_kompanii_quarkly (
Блог компании Quarkly
), #_razrabotka_vebsajtov (
Разработка веб-сайтов
), #_javascript, #_programmirovanie (
Программирование
), #_reactjs
Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Текущее время: 22-Ноя 08:20
Часовой пояс: UTC + 5
| Автор | Сообщение |
|---|---|
|
news_bot ®
Стаж: 6 лет 9 месяцев |
|
|
Привет! Для начала процитирую страницу из Википедии, да будет здоров Джимми Уэйлс и все редакторы, поддерживающие свободную энциклопедию. Согласно ней, индекс бигмака — это неофициальный способ определения паритета покупательной способности. Если проще, этот индекс довольно наглядно показывает уровень цен в стране, ведь в основе стоимости бигмака: две мясных котлеты гриль, специальный соус, сыр, огурцы, салат и лук, всё на булочке с кунжутом… Кроме этого, конечно же, в ценник заложены аренда помещений и оборудования, рабочая сила и многие другие факторы. Важно и другое: милые сердцу многих рестораны с желтой буквой «M» имеют обширнейшую сеть, что дает возможность сравнить цены почти по всему миру. Исследования ведутся с 1986 года и постоянно актуализируются журналом «The Economist». Мы визуализировали имеющиеся в свободном доступе данные и собрали простое приложение, используя React и наш проект Quarkly.  Пост получился бы менее интересным без технической части, хотя поиграться с числами и посмотреть, сколько бигмаков вы могли себе позволить несколько лет назад на свою зарплату в Израиле или, например, во Вьетнаме, путешествуя как настоящий кочевник, тоже интересно. Не агитируем брать валютные ипотеки, ориентируясь на индекс бигмака (к слову, в странах Африки есть ещё и индекс KFC), наш пост чуть об ином. Основной нашей задачей было посмотреть на практике, насколько просто и быстро получится реализовать подобную задумку, работая лишь в одном инструменте. Коротко про человекочасы — в самом конце поста. Часть 1. Пишем код компонента с нуля Записали видео всего процесса с русскими и английскими субтитрами. В описании есть таймкоды, чтобы сэкономить время и посмотреть только то, что вам интересно.  Извините, данный ресурс не поддреживается. :( Всю кодовую часть пишем внутри Quarkly.io, используя хуки. Данные подтягиваем из базы, которая есть в свободном доступе на гитхабе. Часть 2. Настраиваем визуал приложения Прелесть в том, что для этого нам не нужно переключаться на другой инструмент и продумывать логики того, как связать наш код и дизайн. В Quarkly всё уже находится под рукой.  Извините, данный ресурс не поддреживается. :( Начинать стилизацию не нужно с чистого листа, поскольку структура и логики уже были созданы на предыдущем этапе. Это сильно экономит время. Смотрим на результат Приложение доступно по ссылке bigmaconomics.com. На всю работу с учетом написания кода компонента и последующей донастройки визуала ушло около 15 часов с перерывами, поделившими процесс на два дня. Вероятно, можно было управиться быстрее, но такой задачи изначально не стояло. Было интересно понять, насколько проект подходит для практического решения подобной задачи в целом. Приглашаем в наше комьюнити Quarkly в телеграме, где мы делимся новостями про апдейты и отвечаем на вопросы. =========== Источник: habr.com =========== Похожие новости:
Блог компании Quarkly ), #_razrabotka_vebsajtov ( Разработка веб-сайтов ), #_javascript, #_programmirovanie ( Программирование ), #_reactjs |
|
Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы
Текущее время: 22-Ноя 08:20
Часовой пояс: UTC + 5