らぼるてっく。

てっくてっく歩いてっく。

トンネリングツールのExposeを使ってみた

こんにちは、ラボルの@naoki_m05です。 @lbl_teraokaがローカルで起動しているWebサーバーをインターネットに公開するツールであるngrokの紹介をしていますが、ngrokの代替ツールでありOSSでもあるExposeを使ってみたので、それの紹介をしたいと思います。 E…

ngrokの使い方と運用方法

はじめに こんにちは‍ ラボルのUIデザイナー/フロントエンドエンジニアの寺岡です。 みなさんは開発環境を開発者以外の人に共有したい時、どのようなやり方をしてますでしょうか? 本番環境以外の確認用の環境があればいいですが、新規開発などではそこまで…

CompositionAPI vs OptionAPI

はじめに こんにちは‍ ラボルのUIデザイナー/フロントエンドエンジニアの寺岡です。 今回はVue3から新しく使えるようになったComposition APIと、既存のOption APIの比較記事です。 Composition APIは何ができるようになったのか?どういった場面でメリット…

Vue3を用いた「リアルタイムバリデーション」の実装方法

はじめに こんにちは‍ ラボルのUIデザイナー/フロントエンドエンジニアの寺岡です。 早速ですがフロントエンドのみなさん、フォームのリアルタイムバリデーションってどのように実装されてますでしょうか? リアルタイムバリデーションとは、入力時やフォー…

Figmaで作る、変更に強いWebデザイン

はじめに こんにちは‍ ラボルのUIデザイナー/フロントエンドエンジニアの寺岡です。 みなさんFigmaは使っていますか? 最近、UIデザインツールとしてトレンドであり、ラボルもUIデザインはFigmaを採用しています。 そんなFigmaですが、ただUIデザインを作る…

リモート開発で実現した僕のSemi-ultimate coding experience

PCが遅い問題を解決するため、ローカルPCの負荷をリモートサーバーに移すような環境を作りました。

アコーディオンUIのデザインからコーディングまで

はじめに こんにちは‍ ラボルのUIデザイナー/フロントエンドエンジニアの寺岡です。 みなさんはアコーディオンUIのデザイン・コーディングはどのようにしてますでしょうか? よくある質問とかに使われる、こういったUIですね。 「情報を階層的に定義する」・…

Vue.jsのコーディングスタイルとcomputedを使うべき理由

こんにちは、ラボルの@naoki_m05です。 ラボルでは、フロントエンドにVue.jsを使用しているのですが、コードレビューにて「ここはdataじゃなくてcomputedにした方がいいよ」という指摘がこれまでで10回以上ありました。 suggestion getCurrentYear()はcomput…

ALTER文を正しく安全に使うためのIntelliJの機能を紹介

こんにちは!! 新卒1年目の伊藤です。 今回の記事では、私がしてしまったALTER文にまつわる失敗とその再発防止に役立つIntelliJの機能を紹介していきます。 私がした失敗の再現 私が当時した失敗をsampleテーブルを用いて紹介します。 やりたかったことは既…

Illustratorの変数・アクションを活用して、CSVから名刺データを一括生成!

はじめに こんにちは‍ ラボルのデザイナーの寺岡です。 突然ですが、デザイナーのみなさん。名刺データってどうやって管理・作成してますか? 僕は今までスプレッドシートでテキストを管理して、Illustrator(デザインファイル)で情報を入力していく、という…