👋 Привет всем!
вступление
Я уже давно работал над этим приложением с целью, в первую очередь, программное обеспечение для Windows. Тем не менее, после его выпуска я получил много запросов с вопросом, есть ли у меня планы на версию MAC. Однако во время выпуска я не сделал, теперь приложение доступно на обеих платформах!
Итак, сразу после релиза я сделал приоритетом, чтобы послушать то, что все хотели, и надеялся построить версию MAC в течение нескольких недель, но в конце концов, что удивительно оказалось, что он занимает менее одной недели.
Он построен с использованием электрона, так что с самого начала был хороший выбор, и это также означало, что у меня были ресурсы, чтобы создать его и для других платформ. Я знаю, что есть много людей, которые не предпочитают электрон, но с мощностью и скоростью, которые он обеспечивает, особенно для сольного разработчика, это довольно невероятно!
О сланце
Что касается приложения, Slate это приложение, которое позволяет вам иметь плавучивые окна, контролируемые непрозрачностью, которые остаются на вершине, что дает вам место, чтобы сделать еще больше на вашем экране.
Таким образом, как вы можете видеть, было много вещей, которые нужно учитывать, когда делал его доступным на Mac. И, к счастью, электрон обрабатывает большую часть этого из коробки! Хотя были еще некоторые изменения, которые необходимо было сделать, чтобы заставить его работать на Mac.
То, как Mac и Windows Rade Apps совершенно разные, и я узнал, что Mac обрабатывает приложения, которые больше похожи на документы, от того, как приложения устанавливаются до того, как они используются.
Специфический код платформы в одной кодовой базе
Еще одна большая разница заключалась в том, что на Mac, когда вы закрываете приложение, оно на самом деле не закрывает его, как оно, скорее, оно просто приостанавливает его. В отличие от Windows, где вы просто нажимаете «X», чтобы закрыть и приложение, на Mac вам необходимо специально бросить его, используя CMD+Q. И не только эта разница меняет, как пользователи взаимодействуют с приложением, но также меняет способ структурированного кода для платформы.
Поэтому мне пришлось изменить способ, которым приложение обрабатывает закрытие, увольнение и открытие на Mac. Но даже при этом я смог использовать одну кодовую базу, а не создавать совершенно отдельный проект для Mac.
И вот где появляется еще одна мощная особенность электрона. Вы можете иметь одну кодовую базу и просто выбрать, какие части вашего кода вы хотите выполнить, на каких платформах. Итак, с этой единственной строкой кода, Process.platform Вы можете проверить ОС, в которой вы находитесь, и соответствующим образом структурировать свой код, чтобы функции работали, как они должны в конкретной ОС.
Родитель и ребенок на Mac
Третьим большим для меня было то, как модалы обрабатываются на macOS. Вместо отдельного окна, которое появляется на Windows, на Mac модалы похожи на листы, а приложение к вашему приложению, так что вы не можете перемещать их отдельно. И это было большим, так как приложение позволяет использовать модальное окно, чтобы перетаскивать его вокруг, однако это было невозможно на Mac, поскольку листы не могут быть перетаскиваны. Таким образом, чтобы исправить это и убедиться, что чистый и последовательный пользовательский интерфейс остается на протяжении всего приложения, код, который обрабатывает перетаскивание, должен был быть полностью переписан, чтобы справиться с тем, как Mac обрабатывает родительские и детские окна.
Упаковка и электрон-строитель
И, наконец, после всех этих изменений и других меньших исправлений ошибок (например, обработка светофоров на Mac) позаботились, пришло время упаковать его! И это оказалось той частью, которая заняла больше всего времени. Оказывается, не очень хорошая идея, чтобы попробовать упаковывать приложение для платформы, с которой вы не знакомы. И тогда я наткнулся на электрон-строитель.
Вместо того, чтобы вручную делать все вручную и упаковать его вручную с нуля, электрон-строитель обрабатывает большую часть тяжелой работы для вас. Вы просто устанавливаете его, а затем указываете настройки конкретных ОС для того, как вы хотели бы настроить его и какую платформу вы создаете, и она справится с остальными. И через несколько минут вы получите полностью рабочую сборку для платформы, которую вы хотите!
Уроки выучены
И это было все! Теперь у меня было приложение, которое доступно как на Mac, так и на окне, тогда оно было так же просто, как загрузить его и делиться новостями с теми, кто хотел его на Mac!
Еще несколько вещей, которые нужно иметь в виду при работе с электроном или узлом, или даже JS в целом, это то, что есть пакет для всего! Если вы делаете что -то с нуля и обнаружите, что это довольно утомительно или вы не получите желаемые результаты, вы обязательно найдете пакет для этого! И это то, что я должен был сделать раньше и при упаковке приложения.
Другое дело, что, работая с электронным строителем, лучше построить его для ОС, в которой вы не можете создать для Mac из Windows, и есть много ошибок, когда дело доходит до строительства для Linux из Windows также.
Вывод
Надеюсь, вы узнали что-то для моего путешествия, и что это было полезно для создания вашего следующего кросс-платформенного приложения! 😄
Если вы хотите проверить Slate, вы можете сделать это здесь: slate.madebyayan.com
Оригинал: “https://dev.to/madebyayan/after-producthunt-a-journey-of-prioritizing-feedback-and-making-my-app-cross-platform-within-a-week-of-launch-using-electron-ahf”