こんにちは、最近はスプレッドシートの値をgetValuesした時の型が自由すぎることが悩みの宮本です。便利といえば便利なんですが、自由奔放すぎてTypeScriptだとちょっと手を焼いています。 はじめに みなさん clasp はご存知でしょうか？claspは、Google Apps Script（以下GAS）のプロジェクトをコマンドラインでデプロイできるようにできるツールです。GASをローカルで開発し、コード自体もgit管理したりと、これ一つでGASの使い勝手が一気に上がることでしょう。 さて、このcl

はじめに こんにちは。システムエンジニアの佐藤です。 WESEEK では Rails を使った Web アプリケーションの開発をするプロジェクトがあります。 この記事では Webpacker から後継である Shakapacker への移行を経験した際に、どのような差があったのか確認した結果を紹介したいと思います。 Webpacker は引退した Readme.md にもあるように、Webpacker は 5 年間に渡って Rails コミュニティにより提供されてきましたが、Rails 7 からは def

こんにちは。配配メール開発課のmoryosukeです。 最新のLaravelではデフォルトのフロントエンドビルドツールがLaravel MixからLaravel Viteへと移行しました。 そこでTailwind CSS をビルドする手順を追いながらLaravel Viteに慣れていこうと思います。 Laravel Viteとは 事前準備 プロジェクト作成 Tailwind CSSを導入する 補足 最後に Laravel Viteとは Laravel ViteはLaravel用の高速なフロントエンド・ビル

初めに こんにちは。フロントエンドエンジニアの竹本です。 入社してそろそろ4ヶ月が経とうとしています。だいぶBASEの開発にも慣れてきました。 この記事では私が社内の静的アセットを管理しているリポジトリ(以降は便宜上 static-repository と呼びます)のNode.jsのバージョンを12から16にあげたら、webpack dev serverの立ち上がりが約12分から約5秒に短縮できた話を紹介したいと思います。 この作業は業務の隙間時間でやったのですが、どのように取り組んでリリースまで持ってい

vue3-migration-improve-frontend はじめまして！　 BALES CLOUD エンジニアのえーす（井上）です。この度、BALES CLOUDで長年使ってきたVue2から卒業し、Vue3を導入した状態でリリースできました。今日はこれについてお話できればと思います。 やったこと なぜVue3移行をしたか TypeScriptサポート 各ライブラリが古い Vue2のEOLが近い 具体的なVue3移行ステップ Vuetify卒業 Vue3導入 Vue3完全移行 移行にあたって問題だった

TL;DR Chrome Extension経由で独自に学習したMLモデルを社内配布できるようにしました モデルはユーザのブラウザ上で実行するので余計な通信も発生せず クラウド 代も不要です 背景 こんにちは。CADDi AI Lab MLOpsチームの中村遵介です。普段は 機械学習 エンジニアチームの作るモデルを Vertex Endpointsを使用してAPIとして提供 したり、パイプラインに組み込んで推論結果をデータ提供したりするお仕事をしています。モデルは様々な種類がありますが、一番多いのは図面画

こんにちは！カケハシにて薬局と患者の関係性を向上させるためのツールである 患者リスト というWEB業務アプリケーションを開発している小室と申します。 本プロダクトのフロントエンドの開発環境としては、 React + esbuild を採用しており、採用の経緯や実践している環境構築方法などは以下の通り、 TechPlay や Qiita などに記事を投稿してきました。 TechPlay: 新規事業プロダクト開発時の技術選定どうやった？ スライド Qiita: esbuild + React(TS) で実現す

本記事は CyberAgent Developers Advent Calendar 2022  2 ...

こんにちは、エス・エム・エスのフロントエンドエンジニアの城内です。 前職では、ヘルスケア系のスタートアップでソフトウェアエンジニアをしていましたが、2022年8月にエス・エム・エスへ入社し、介護事業者向けの経営支援サービス「カイポケ」の改善をするチームに所属しています。 カイポケの改善を進める開発チームでは、この度フロントエンド専任チームを立ち上げました。この記事ではフロントエンドチーム立ち上げの背景や、チームの立ち上げから進めてきた技術選定について書きたいと思います。 カイポケ改善プロジェクト 介護事業

ミイダスのフロントエンド開発では、これまでReactとReduxを中心に、プロダクトや開発組織フェーズとその変化に対応するため技術選定を進めてきました。 そして2021年からスタートしたNext.jsへの移行計画「ミイダス2.0」プロジェクトの全貌について、フロントエンド開発を担当した後藤と松村、李に話を聞きました。 移行した背景や課題、今後の展望についてご紹介します。 2021年のミイダスのフロントエンド開発環境については以下の記事をご覧ください。 https://note.com/miidas_tec

Prettier の代替として Rome 触ってみた はじめに こんにちは、旅行 PF 部エンジニアの奥田です。 この記事では、Prettier の 10 倍速いと言われるRomeを触っていきます。 ここまで圧倒的な速度を喧伝されては気になるのは人の性…さっそく触っていきます！ Rome とは フロントエンド開発のツールチェインを 1 つに統一することを目指しているプロジェクトです。 Babel,ESLint,webpack,Prettier,Jest などのツールを置き換えることを目的にしています。 速

こんにちは。Pay ID Devの大木 ( @roothybrid7 )です。 今回外部スクリプトとして読み込み利用する外部SDKを、Reactに組み込むためのラッパーライブラリを作ったので、その開発事例を紹介します。 今回、 SWC(Speedy Web Compiler) や Release Please を利用して開発したので、主にそれらをどう使ったのかを紹介いたします。 背景 去年12/16に開催しましたオンラインイベント 「BASE Tech Talk #1 〜Next.jsを使ったカート大規模

基盤チームの右京です。 昨今はフロントエンドのアプリケーションもリッチになり、ブラウザ上で実行されるコードが行うことの範囲も増えてきました。一方で多くのことを実装できてしまうのはリスクでもあり、BASE でも問題となることがあります。 その中でも「開発環境の URL」や「デバッグ機能の存在」ような環境毎に異なる情報は、特に意図せずに漏れやすいものだと考えています。これらはコードを記述する際に、実装方法を知識として知っていればその多くが回避可能です。この記事ではその実装例を解説しています。 コードから漏れる

こんにちは!! スマートキャンプでエンジニアをしている吉永( @__GGEasy )です！ 自己紹介記事はこちら 前回の記事はこちら 私は現在、スマートキャンプの主力サービスであるBOXIL SaaSの開発にフロントエンド、バックエンド問わず携わっています。 今回は、弊社で新規サービスとしてリリースしたBOXIL SaaS質問箱(以下SaaS質問箱)にて、React.js(以下React)を私の主導で採用しました。 この記事では、フロントエンド整備に至った経緯や、今後のBOXIL SaaSにおけるフロント

はじめに こんにちは、インターン生の手塚です。 今回はGROWIにおけるwebpackの設定について、調べてみたので記事にします。この記事はGROWIにおけるwebpackの設定に着目しているのでwebpackの基礎知識や、使い方の詳細は説明していません。webpackについてある程度の知識がある人に、プロジェクトへの活用例として参考にしてもらえればなと思っております。 webpackは設定が複雑で、そのため「webpack職人」と呼ばれる人たちが存在します。本当は、誰もが簡単に設定できるのが理想であり、