LiBz Tech Blog

LiBの開発者ブログ

Vue.js + Algoliaを使って、フロントエンド開発だけで検索機能を実現する

はじめに 前回書いたvue-cli uiでVue.js開発環境を作る記事を書いたところ、同僚がそれを引き継いでvui-cli uiで立ち上げたアプリに「APIから取得したデータでユーザーの一覧を表示する」機能を追加した記事を書いてくれました。 tech.libinc.co.jp tech.lib…

チートシートで学ぶ、憧れのVimmerへの挑戦!!! ~ 入門編 ~

はじめに こんにちは!最近暑くなってきましたね、夏の始まりを感じます! オフィスにこもってばかりしてないで、プールに足でも浸かりながらプログラミングをしたいなーなんて思う今日この頃です。 あくまでお仕事でね。 ということで、弊社ブログでは2週…

Vue CLI UIを活用して実際にアプリを作ってみた

はじめに LiBではフロントエンド勉強会をしており、最近は勉強会の中でVue CLI UIを使ってアプリを作っています。 関連記事 3ヶ月間バックエンドエンジニア向けにフロントエンドを学ぶ勉強会を行った話 フロントエンド初心者がVueUIを使って爆速でVueアプリ…

GASとVueでエンジニアのMuscleを可視化した

はじめに こんにちは!前回の投稿から3ヶ月が経過して入社9ヶ月目になりましたが、今回はつまずいたシリーズはお休みしてGoogle App Script(以下、GAS)とVueで筋肉量を可視化した話を投稿させて頂きます! tech.libinc.co.jp LiBのエンジニアでは夏に向け…

とってもRailsライクなサーバーレスフレームワーク「Ruby on Jets」を本番環境に導入した話

はじめに 経緯 構成 技術選定 Lambdaのランタイム(言語)は何で実装するのか? サーバーレスアーキテクチャの構成管理に何を利用するのか? Jetsをちょっとだけ解説 プロジェクトの作成 ルーティングの設定 コントローラー 必要なIAMポリシー シークレットキ…

【Rails】Sidekiqの監視で工夫したこと

はじめに 最近SREだのDevOpsだの開発と運用にフォーカスがあたることが多いようで、 弊社でもDevOpsチームというものが発足されました。 開発しているエンジニア全体に、しっかりサービスの監視をしてもらえるようにインフラからアプリケーション層のエラー…

3ヶ月間バックエンドエンジニア向けにフロントエンドを学ぶ勉強会を行った話

はじめに こんにちは、最近カタンにハマっている阿部と申します。 社内のエンジニアの勉強会で「フロントエンド周りについて学ぶ」を担当させてもらったのでその勉強会についてのレポートになります。 ちなみにカタンの基本戦略としては、鉱石と小麦をおさえ…

【Sketch】デザインファイル管理にAbstractを導入してみた話

はじめまして。 LiBのデザイナーのスナダです。 主にLiBzCAREERの デザイン/設計/仕様策定などを担当しています。 LiBzCAREERはUIデザインツールにSketchを使用しています。 最近、デザインファイルの管理にAbstractを導入し、まだまだ探り探りではあります…

新卒エンジニアが「デザインの4つの基礎」を使ってはじめての名刺づくりをしてみた

はじめに こんにちは! この春にリブに新卒で入社した江田です。 これまで、内定者インターン時代にテックブログを2記事執筆しています。 deviseとGoogle Authenticatorを用いてRailsシステムに「二段階認証」を導入した話 - LiBz Tech Blog ゼロから10分…

EC2インスタンス起動時に自前スクリプトを実行するには

なにを書くのか 起動シークエンスに自前スクリプトを埋め込むときの注意について。単語的にはchkconfig や cloud-init です。 なぜ書くのか EC2インスタンス再起動時に自前スクリプトからプロセスが起動しなくてツラい思いをしたので。 結論 AWSで自前スクリ…

フォームのsubmitイベントをキャンセルする方法まとめ

令和も当ブログをよろしくお願いします。 はじめに 1. onclick属性やonsubmit属性を使う場合 formのonsubmit属性に関数を指定する submitボタンのonclick属性に関数を指定する 2. AddEventListenerを使う場合 formにsubmitイベントリスナーを追加する submit…

Vue+RailsでGitHubみたいなチェックボックスリスト(マークダウン入力)をサーバよりに作る

はじめに 個人的にVueの勉強のために作ってるタスク管理ツールでGitHubみたいなチェックボックスリスト(マークダウン入力)を作りたくなりました。 またこのフィールドにURLが貼り付けられたらリンクにしたい欲求もありました。 まとめると マークダウンの形…

フロントエンド初心者がVueUIを使って爆速でVueアプリを立ち上げてみる

はじめに これまではPHPやRailsでのサーバサイドアプリケーションの開発がメインでしたが、最近はフロントエンドの開発も一部担当するようになってきました。 今の開発現場では一部Vue.jsを導入しているので、Vue.jsの勉強をしています。 はじめに — Vue.js …

春のオススメ【元新幹線車掌と巡るLiBエンジニア開発環境ツアー】

プロローグ 長かった冬が過ぎ去り、心地よい風が春の訪れを感じる今日この頃。 待ちわびていたかのように桜の花びらが満開となり、みなさまにおかれましてはお花見などを楽しまれたのではないでしょうか? 季節が過ぎるのが早いもので私、ヌカタがエンジニア…

Railsで複数モデルを扱うフォームをすっきり書く(Formオブジェクト)

はじめに Railsで1つのフォームで複数モデルを扱うときに、accepts_nested_attributes_forを使うサンプルをよく見るのですが、DHH氏が消したいと言っていたり バグが多かったりなど色々問題があるようです。 代わりにFormオブジェクトを使うのが良いと聞いた…

入社6か月間で駆け出しエンジニアがつまずいたポイント

前回「入社2か月間で駆け出しエンジニアがつまずいた15のポイント」 tech.libinc.co.jp という記事を書かせて頂いてから早いもので入社6ヶ月目になりました。 たくさんの方に読んで頂けたようでありがとうございます。 未経験 ~ 駆け出しの間は特に不安だっ…

Kubernetes(GKE)にお安く入門する

目次 目次 はじめに 経緯 そもそもKubernetesとは なぜEKS(AWS)ではなくてGKE(GCP)なのか 無料のクラスタをつくる とりあえずk8sクラスタをつくってみる ノード(インスタンス)が1つだけのノードプールをつくる 3つのノードが登録されているノードプールを消…

Vue+SVGでLGTMの画像制作ツールを作ってみた

ご挨拶 こんにちは! 主にフロントエンド周りをやっているアベです。 前回Vueの記事を書き(真のフロントエンドエンジニアになるために、まずはNuxt.js + Firebaseを使って簡易メモ帳を作ってみた - LiBz Tech Blog)、次はReactを触ってみようかなと言っていた…

Dartでリバースプロキシを作ってみる

はじめに 低レイヤプログラミングという記事をみて、普段扱っているものが、どのようにして動いているのか理解できていないことが多いなと反省しています。 なので、普段使っているものの仕組みを改めて学んでいこうと思います。 なぜリバースプロキシか 元…

ゼロから10分でブログが作れる!Rails 6の新機能「Action Text」を試してみた

はじめに 株式会社LiBの19卒内定者のエディです! 最近は漫画『王様達のヴァイキング』にハマっています 前回はRailsアプリに二段階認証を導入するという記事を書きました(4ヶ月前) tech.libinc.co.jp さてさて、今回のテーマは2019年の4月にリリース予定…

すぐできる!古今社内Bot活用事例大全【Slack編】

なぜ書くのか 飲みの場でどんなBotが社内で動いてるかって結構盛り上がるネタだったりしませんか? くだらなかわいいBotから実用的なBotまで、SlackBotからIoT的Botまで。(ところでBotとRobotの違いってなんでしょう?) 先日も社外エンジニアの方とひと盛…

「未経験からのエンジニア転職の人」に伝えたい8のこと

はじめに LiBでCTOしている水上です。 ブログを書くにあたり、サーバサイドエンジニアから見るVueとか題材を悩んだのですが、 最近2020年卒の新卒内定エンジニア第一号が出たので、 このタイミングで未経験エンジニアからベテランエンジニアなるための心構え…

普通のチームで立ち向かう - Railsアプリでのテストコードポリシー -

皆さん自分たちのプロダクトにテストコードは書いているでしょうか? LiBzCAREERではRspecやCIなどテストコードを書くための仕組みは割と初期から用意していました。 ただし、テストコードを書くべきかの基準が明確になっておらず、テストコードが書かれてい…

Webエンジニアに転職した新幹線車掌が伝えたい7つのこと

はじめに はじめまして。株式会社LiBでWebエンジニアをしている額田(ぬかた)と言います。 LiBには昨年10月にWebエンジニアとして入社し、現在4ヶ月目に突入しました。 私はもともと某鉄道会社にて駅係員、新幹線車掌と約8年間の鉄道人生を送っていて、プロ…

【コードつき】Alexa Echo Spot(画面付きAlexa)スキル開発

はじめに 作るもの Alexa開発者アカウント、AmazonDeveloperアカウント作成 【Alexaコンソール】スキル設定 【Lambdaコンソール】Lambda設定 関数作成 コードアップロード 【Alexaコンソール&Lambdaコンソール】AlexaとLambdaの連携 【Lambdaコンソール】テ…

Terraform ことはじめ

あけましておめでとうございます 年末年始は実家でポケモンGO活に明け暮れていました。 コダックとコラッタばかりで地域格差をひしひしと感じました。 ※ 去年末、社内勉強会でTerraform入門会を開催しました。一部内容変えて記事にしています。 いざ概論 弊…

入社2か月間で駆け出しエンジニアがつまずいた15のポイント

目次 目次 初めに 共通のつまずき メソッドを作るのが怖い データの削除って、データ消すって意味じゃないんですか? 謎の呪文 後置if、早期リターン、三項演算子 後置if 早期リターン 三項演算子 null(nil)チェックって本当に必要? Pushする勇気! 開発はS…

GitのコミットメッセージにEmoji Prefixを使ってテンションをあげたい話🕺💃🕺💃

目次 目次 はじめに このブログを書こうと思った経緯 ✨Emoji Prefix✨ メリット このコミットでなにをしたか分かりやすくなる コミットの粒度が適切になる キレイに見える⭐ テンションがあがる(重要) デメリット Emojiの意味や種類を覚える・入力するのが面倒…

Railsのcredentials.yml.encは、どういった運用ができるか?

はじめに セキュリティの意識について なぜcredentials.yml.enc? 解決策 credentials.yml.encをメインに使う場合 本番環境以外は、機密情報扱いにせずオープンな状態にしておく rails-env-credentialsで環境ごとにcredentials.yml.encを用意 本番環境に環境…

真のフロントエンドエンジニアになるために、まずはNuxt.js + Firebaseを使って簡易メモ帳を作ってみた

転職する際、フロントエンドエンジニアとして動いていたのですが、 とある企業からは**「jsフレームワークやっていないとフロントエンドエンジニアとしての技術が低い」**と言われ、 jsフレームワークを経験していないとフロントエンドエンジニアと名乗って…