Мне нравится проводить время, изучая новые технологии. Однако зачастую самым большим недостатком работы с новыми технологиями являются неизбежные болевые точки, возникающие при раннем внедрении. Я видел это довольно часто, когда знакомился с Web3 в статье «   ». Как перейти от Full-Stack Developer к Web3 Pioneer в 2022 году  Как инженеры-программисты, мы привыкли принимать вызовы первых пользователей, тестируя новые технологии. Для меня лучше всего вести постоянный список заметок и команд, которые я выполнил, поскольку казалось бы нелогичные шаги не остаются в моей памяти.  Помимо Web3, я также обнаружил эту проблему в области JavaScript с полустандартными требованиями использования Node.js и Webpack. Я хотел найти решение, в котором я мог бы просто использовать JavaScript как есть, не утруждаясь Node.js и Webpack. Недавно я прочитал, как выпуск Rails 7 решил   . Именно об этом варианте использования я и расскажу в этой статье. эту самую ситуацию  О рельсах  Честно говоря, мой опыт работы с Ruby и Ruby on Rails практически нулевой. Я помню, как много лет назад наблюдал, как кто-то вводил команды для создания полнофункционального сервиса, и подумал: «Ух ты, это выглядит потрясающе». Но я никогда не тратил время на эксперименты с этим подходом к созданию сервисов и приложений.  Я почти уверен, что видел эту демонстрацию в начале 2006 года, потому что Rails впервые появился в конце 2005 года. Как я видел в демонстрации, конечным результатом стал сервис, поддерживающий шаблон проектирования модель-представление-контроллер (MVC), шаблон, который Я был знаком с ранним использованием фреймворков Spring, Struts, JSF и Seam.  Rails обещает сохранять простоту, придерживаясь при этом практики DRY (не повторяйтесь). Чтобы выполнить это обещание, Ruby использует Gems, чтобы инженеры могли вводить общие зависимости в свои проекты.  Особенности версии 7  В конце 2021 года седьмая основная версия Rails представила несколько интересных функций:  Асинхронные запросы – отказ от последовательного выполнения запросов  Уровень зашифрованной базы данных – защита данных между уровнями службы и постоянства.  Валидатор сравнения – позволяет проверять объект перед сохранением.  Импортируйте карты — больше не требуется Node.js и Webpack для библиотек JavaScript.  Именно эта последняя особенность побудила меня написать эту статью.  Как работает импорт карт?  На высоком уровне Gem   позволяет разработчикам импортировать карты в свои приложения. Использование   позволяет инженерам обновлять, закреплять или откреплять зависимости по мере необходимости. Это похоже на то, как Maven и Gradle работают в проектах на основе Java. importmaps-rails /bin/importmap  Это избавляет от необходимости иметь дело со сложностями, связанными с объединением пакетов и транспиляцией ES6 и Babel. Прощай, Вебпак! Прощай, Node.js!  Давайте построим что-нибудь  Поскольку я даже не прикасался к Ruby on Rails почти два десятилетия, первое, что мне нужно было сделать, — это следовать   , чтобы установить Ruby 3.3 на мой MacBook Pro. После установки мне просто нужно было   как часть моей IDE IntelliJ IDEA. этому руководству установить плагин Ruby  Затем я создал новый проект Ruby on Rails в IntelliJ под названием   и указал использование   для платформы JavaScript:  import-map Importmap Создав проект, я сначала хотел посмотреть, насколько легко будет использовать локальную библиотеку JavaScript. Итак, я создал новый файл JavaScript под названием   со следующим содержимым: /public/jvc_utilities.js   export default function() { console.log('*****************'); console.log('* jvc-utilities *'); console.log('* version 0.0.1 *'); console.log('*****************'); }  Функция по умолчанию просто отображает некоторые команды на консоли JavaScript.  Затем я создал HTML-файл (   ) со следующим содержимым: /public/jvc-utilities.html   <!DOCTYPE html> <html> <head> <title>jvc-utilities</title> </head> <script type="importmap"> { "imports": { "jvc_utilities": "./jvc_utilities.js"} } </script> <script type="module"> import JvcUtilities from "jvc_utilities"; JvcUtilities(); </script> <h3>jvc-utilities.html</h3> <p>Open the console to see the output of the <code>JvcUtilities()</code> function. </p> </html>  В этом примере показано, как локальный файл JavaScript можно использовать с общедоступным файлом HTML без каких-либо дополнительных действий.  Затем я создал новый контроллер под названием   : Example   bin/rails generate controller Example index  Для этого примера я хотел использовать   , поэтому использовал следующую команду, чтобы добавить библиотеку в свой проект   : библиотеку Lodash import-map   bin/importmap pin lodash  Чтобы добавить в контроллер некоторые функции на основе JavaScript, я обновил   чтобы он выглядел следующим образом: javascript/controllers/example_controller.js   import { Controller } from "@hotwired/stimulus" import _ from "lodash" export default class extends Controller { connect() { const array = [1, 2, 3] const doubled = _.map(array, n => n * 2) console.log('array', array) // Output: [1, 2, 3] console.log('doubled', doubled) // Output: [2, 4, 6] this.element.textContent = `array=${array} doubled=${doubled.join(', ')}` } }  Эта логика создает массив из трех значений, а затем удваивает значения. Для этого я использую метод Lodash   . map()  Наконец, я обновил   , включив в него следующее: views/example/index.html.erb   <h3>Example Controller</h3> <div data-controller="example"></div>  На данный момент доступны следующие URI:   /jvc-utilities.html   /example/index  Давайте развернем и проверим  Вместо того, чтобы запускать службу Rails локально, я решил использовать Heroku. Таким образом, я мог быть уверен, что мой сервис будет доступен другим потребителям.  Используя свою учетную запись Heroku, я следовал руководству «   ». Основываясь на моем проекте, моим первым шагом было добавить файл с именем   со следующим содержимым: Начало работы с Heroku с Ruby Procfile   web: bundle exec puma -C config/puma.rb  Затем я использовал интерфейс командной строки Heroku для создания нового приложения в Heroku:   heroku login heroku create  С помощью команды   у меня было запущено следующее приложение: create   Creating app... done, ⬢ lit-basin-84681 https://lit-basin-84681-3f5a7507b174.herokuapp.com/ | https://git.heroku.com/lit-basin-84681.git  На этом этапе также был создан удаленный Git, который использует экосистема Heroku.  Теперь все, что мне нужно было сделать, это загрузить последние обновления в Heroku и развернуть приложение:   git push heroku main  При этом мой код был отправлен в Heroku, который затем скомпилировал и развернул мое приложение. Менее чем через минуту я увидел следующее, сообщающее мне, что мое приложение готово к использованию:   remote: Verifying deploy... done. To https://git.heroku.com/lit-basin-84681.git fe0b7ad..1a21bdd main -> main  Затем я перешел на страницу   используя URL-адрес Heroku (который уникален для моего приложения, но с тех пор я его удалил):  /example/index https://lit-basin-84681-3f5a7507b174.herokuapp.com/example/index  Вот что я увидел:  И когда я просмотрел консоль JavaScript в своем браузере, появились следующие журналы:  Перейдя к   , я увидел следующую информацию:  /jvc-utilities.html Когда я просмотрел консоль JavaScript в своем браузере, я увидел следующие журналы:  Успех. Я смог использовать автономную библиотеку JavaScript, а также общедоступную библиотеку JavaScript Lodash в своем приложении Rails 7 — и все это с помощью Import Maps и без необходимости иметь дело с Webpack или Node.js. Прощай, Webpack и Node.js!  Заключение  Мои читатели, возможно, помнят мое личное заявление о миссии, которое, по моему мнению, применимо к любому ИТ-специалисту:  «Сосредоточьте свое время на предоставлении функций/функций, которые увеличивают ценность вашей интеллектуальной собственности. Используйте платформы, продукты и услуги для всего остального». - Дж. Вестер  В этой статье я с головой погрузился в Rails 7 и использовал карты импорта, чтобы показать, насколько легко вы можете использовать библиотеки JavaScript без дополнительных усилий, связанных с использованием Webpack и Node.js. Я был весьма впечатлен тем небольшим количеством времени, которое потребовалось для достижения моих целей, несмотря на то, что прошло более двух десятилетий с тех пор, как я в последний раз видел Rails в действии.  С точки зрения развертывания, попытка развернуть приложение Rails на платформе Heroku состояла из создания   и трех команд CLI. Procfile  В обоих случаях Rails и Heroku придерживаются моей миссии, позволяя мне оставаться сосредоточенным на предоставлении ценности моим клиентам и не увязнуть в проблемах с Webpack, Node.js или даже задачами DevOps.  Хотя я уверен, что мы и дальше будем сталкиваться с не такими уж идеальными болями при изучении новых технологий, я также уверен, что со временем мы увидим аналогичные достижения, которые я продемонстрировал в этой статье.  Как всегда, мой исходный код можно найти на GitLab   . здесь  Хорошего дня!

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

2022 - HackerNoon Contributor of the Year - Cloud Computing

2022 - HackerNoon Contributor of the Year - Design

2022 - HackerNoon Contributor of the Year - Heroku

2022 - HackerNoon Contributor of the Year - Javascript

2022 - HackerNoon Contributor of the Year - Salesforce

2022 - Hackernoons Tech Storyteller of the Year

I ♥ writing code. Find me on GitLab.

Nominated for 2022 - HackerNoon Contributor of the Year - Javascript

Nominated for 2022 - Hackernoons Tech Storyteller of the Year

Nominated for 2022 - HackerNoon Contributor of the Year - Cloud Computing

Nominated for 2022 - HackerNoon Contributor of the Year - Heroku

Nominated for 2022 - HackerNoon Contributor of the Year - Design

Nominated for 2022 - HackerNoon Contributor of the Year - Salesforce

Этот звук создан на языке оригинала истории!

Слишком долго; Читать

Прощайте, Webpack и Node.js, Hello Rails и импорт карт

Прощайте, Webpack и Node.js, Hello Rails и импорт карт

About Author

КОММЕНТАРИИ

БИРКИ

ЭТА СТАТЬЯ БЫЛА ПРЕДСТАВЛЕНА В

Related Stories

Утечка информации о системе Claude Sonnet 3.5: судебно-медицинский анализ

Хотите выиграть конкурс HackerNoon? Вот что рекомендуют победители конкурса #crypto-api

Цифровые кочевники слушают: что нужно знать о новой визе DTV в Таиланде

Создание криптопродуктов, ориентированных на пользователя: важность отзывов клиентов

Утечка информации о системе Claude Sonnet 3.5: судебно-медицинский анализ

Хотите выиграть конкурс HackerNoon? Вот что рекомендуют победители конкурса #crypto-api

Цифровые кочевники слушают: что нужно знать о новой визе DTV в Таиланде

Создание криптопродуктов, ориентированных на пользователя: важность отзывов клиентов

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps