frontend

2021 LINE NEWS UIT Workshop レポート

こんにちは。

LINE フロントエンド開発センターの安部です。
私が所属するフロントエンドチームでは月間154億PV(2021年8月時点)の大規模サービスであるLINE NEWSの機能追加・改善に日々取り組んでいます。

LINE NEWSの開発を継続していく中で改善のアイデアや要求は日々蓄積していきます。
エンジニアもそれぞれ理想やモチベーションを持って開発を続けていますが稼働中のサービスに対しアーキテクチャやフレームワークの刷新といった大きな変更を伴う改善に着手できる機会はそう多くありません。

またLINE NEWSは企画・開発・QAが分業体制になっているため開発側の都合だけでは作業の優先順位付けができず技術的負債が放置されてしまうこともあります。

その少ない機会への備えや現実的な制約へのフラストレーション発散の場としてLINE NEWSのフロントエンドエンジニア全員で「LINE NEWSを作り直すなら?」というテーマで各メンバーが抱いている理想や、その理想の実現を阻害する原因について話し合うWorkshopを実施しました。

今回の記事ではそのWorkshopの様子を紹介します。多人数チームでの開発や大規模サービスの運営に興味のある方の参考になれば幸いです。

続 LINE 社内用 NPMパッケージの管理戦略

みなさんこんにちは。UIT Front-end Dev7チームの吉澤です。主にUITが扱う社内サービスやミドルウェアの開発/運用などを行っています。
またDev7チームにはLIFF(LINE Front-end Framework)というLINEが使っているフレームワークの開発をしているメンバもいます。他のUITのチームとは一風変わった特徴的なチームです。

このチームの業務の1つにUITが管理しているPrivate npm registryの拡張、関連機能開発/運用があります。
実はこれに関連した全社的にnpmが使えなくなるという障害が2021/2/15にLINE社内で発生していました。今回はその障害について話しながら私たちUITが管理しているPrivate npm registryについての話を書きます。

2022年におけるフロントエンド開発のベースライン

2022にフロントエンド開発で最も考慮すべきユーザー環境は、パフォーマンスでは低スペックのAndroid端末、標準使用では2年前のSafari、そしてネットワークでは4Gです。それに対してはJSへの過剰依存などが原因で主にパフォーマンスの面でのウェブ全体の対応がよくありません。

こんにちは!LINEフロントエンド開発室のダバロス アランです。この記事のタイトルを見て「釣りタイトルですね〜」と考えている方がいると思いますが今回に限ってはそれを多めに見てください。それはなぜかと言いますと、2021年から2022年にかけて私たちフロントエンドエンジニアが全体的に考え方を改める必要が出るほど大きな変化がありました。

その変化とそれに対して私たちフロントエンドエンジニアがちゃんと応えられるているかを色々なデータを見て分析したいと思います。

社内のデザイナーの業務をサポートする LDSG Figma Plugin の工夫したところ、ハマりどころ

こんにちは!LINE Growth Technology UITチームの keishima です。普段はフロントエンドエンジニアとして LINEポイントクラブの開発に携わっています。
本記事では、 UIT 新春 Tech blog 5日目として、社内向けに作った Figma プラグインの技術的な面にフォーカスした記事をお届けします。
Figma プラグインを作った背景や、プラグインの機能紹介は、同時に公開したこちらの記事をご覧ください。(先にそちらを読むのがおすすめです!)

社内のデザイナーの業務をサポートする LDSG Figma Plugin を作りました

こんにちは、LINE Growth Technology UITチームの keishima です。普段はフロントエンドエンジニアとして LINEポイントクラブの開発に携わっています。
本記事では、この半年間で LINE Growth Technology のエンジニア・プロジェクトマネージャーと、 LINE のデザイナーがタッグを組んで作成した、LDSG Figma Plugin についてご紹介します。

フロントエンド開発の業務を支えるちょっと珍しいチームのご紹介

この記事は UIT 新春 Tech blog 4 日目の記事です。

こんにちは。LINE フロントエンド開発センターの前川です。主にフロントエンド開発センターで働く方々のDX改善や、社内サービスの運用を行なっています。

私の所属しているチームは、フロントエンドと名前はついているものの、実際はフロントエンドとそれ以外の業務の割合が2:8程度という珍しいチームです。そのため、技術記事というカテゴリからはやや外れてしまいますが、その業務内容をご紹介したいと思います。

業務で役に立つVS Code機能拡張を作ってみた話

この記事は UIT 新春 Tech blog 3日目の記事です。

こんにちは。LINE証券のフロントエンドを開発している岩本海童です。
今日は、業務で利用できる便利なVS Codeの機能拡張を作ってみた話をします。

業務で見つけた! Conditional Types

こんにちは。LINE証券フロントエンドエンジニアの鈴木です。この記事は「UIT 新春 Tech blog」シリーズ2日目の記事です。

LINE証券ではTypeScriptを使用しており、TypeScriptの力を最大限発揮させられるように日々取り組んでいます。そこで、この記事ではLINE証券のプロダクション用コードで実際にConditional Typesが使用された事例をご紹介します。Conditional TypesはTypeScript 2.8で追加された機能で、部分型関係に基づいた型レベルの条件分岐やパターンマッチができる機能です。TypeScriptの機能の中でも高度な部類であり、一部の型に凝ったライブラリや曲芸的な遊びを除いてはなかなか実用例を聞かないものです。

我々が書いたコードでConditional Typesが使われた事例をご紹介することで、皆さんにもConditional Typesを身近に感じていただき、ぜひ自分のプロダクトでも活用機会を探していただきたいと思います。

Web フォントを使って contenteditable から脱出する

こんにちは、LINE フロントエンド開発センターの玉田です。突然ですが、本日よりフロントエンド開発に携わる UIT のエンジニアが持ち回りで記事を公開する「UIT 新春 Tech blog」を開催します。

UIT のメンバーが普段の業務で得た知識や、年末年始でたまった知見などを共有していきます。本記事の公開から 1 月 28 日 (金) まで、平日の毎日違うメンバーが記事を公開していきます。ぜひ最後まで見に来てください!