ハイクラス求人TOPIT記事一覧React 18とSuspenseの基本 ─ フレームワークの選択やReact Server Componentsなど新しいベストプラクティスを学ぶ React 18とSuspenseの基本 ─ フレームワークの選択やReact Server Componentsなど新しいベストプラクティスを学ぶ 群雄割拠のフロントエンドフレームワーク界でも、一歩抜きん出た存在として常に注目を集めてきたReact。2022年3月にリリースされたバージョン18では、Suspenseの安定化やStreaming SSRのサポートなど数々の新機能を取り入れて話題になりました。本記事では、React／TypeScriptのスペシャリストとして幅広く活躍されているuhyoさんが、現時点におけるReactのベストプラクティスについて解説します。 Reactは、Meta社により開発・公開

ハイクラス求人TOPIT記事一覧Spring Boot 3の新機能を使ってみよう！ 2からアップグレードする手順、Observability機能、ネイティブイメージ化 Spring Boot 3の新機能を使ってみよう！ 2からアップグレードする手順、Observability機能、ネイティブイメージ化 Javaの開発フレームワークであるSpringの最新バージョンとして、Spring Boot 3が2022年11月にリリースされました。この記事ではSpring Boot 2で書かれたサンプルコードをSpring Boot 3にアップグレードしながら、考慮点や新機能を体感していただきます。ヴイエムウェア株式会社の星野真知さんによる解説です。 Javaのエコシステム、その中でも世界で一番の人気を誇るのが（JetBrains社の調査によると）Spring FrameworkおよびSpring B

使用するライブラリ このアプリで、Next.js以外に使用するライブラリは以下の4つです。インストール方法等は必要な箇所で説明します。 Prisma TypeScriptのORマッパーです。アプリでのノートの保存等に使用します。 ▶ Prisma | Next-generation ORM for Node.js & TypeScript Tailwind CSS CSSフレームワークです。アプリのUIデザインに使用します。 ▶ Tailwind CSS - Rapidly build modern websites without ever leaving your HTML. Zod バリデーションライブラリです。APIレスポンスの型定義とバリデーションに使用します。 ▶ Zod | Documentation SWR データフェッチ用のライブラリです。ノート一覧のクライアントサイドで

このようにさまざまなデコレータが用意されていますが、今回はサンプルで利用するデコレータに絞って説明します。他のデコレータについては、NestJSの公式ドキュメントなどを参照してください。 依存性注入（DI） 依存性注入（DI、Dependency Injection）とは、クラスの依存関係を解決する仕組みです。NestJSでは、依存性注入を使ってクラスの依存関係を解決します。 クラスの依存関係とは、クラスが他のクラスに依存している関係のことです。例えば、次のようなクラスAがあったとします。このクラスは他のクラスに依存していません。@Injectable()デコレータを使って、サービスを定義します。 @Injectable() class A { constructor() {} } そして、次のようなクラスBがあったとします。このクラスは、@Inject()デコレータを使って依存性を注入し

FastAPI入門 - モダンなPythonフレームワークの特性をチュートリアルで手軽に学ぶ PythonのWebフレームワークとしていま注目を集めるFastAPIは、シンプルにコードが書けるだけでなく、パフォーマンスが高いWebアプリケーションのバックエンドサーバーが構築可能です。同フレームワークの勘所をPythonスペシャリストの杜世橋さんが、初心者向けのハンズオン、そしてより実践的な画像への自動タグ付けサービス実装をとおして解説します。 FastAPIはいま非常に注目されているPythonのWebフレームワークの1つです。Flaskのようにシンプルに書ける一方でPythonのType Hintの機能をうまく活用し、HTTPのリクエスト/レスポンスをPythonの関数の引数/戻り値とシームレスにマッピングして非常に効率的に開発ができるのが最大の特徴です。非同期処理にも対応していてその名

ハイクラス求人TOPIT記事一覧実践的Djangoプロジェクトの設計―開発・運用が楽になる設定ファイルを書こう！ アンチパターンとベストプラクティス 実践的Djangoプロジェクトの設計―開発・運用が楽になる設定ファイルを書こう！ アンチパターンとベストプラクティス Pythonで広く利用されているWebアプリケーションのフレームワークにDjangoがあります。Djangoで開発を始める際に、プロジェクトの設定ファイルをどのように記述すれば運用が楽になるのか。『Python実践レシピ』の著書もある筒井隆次（ryu22e）さんによる寄稿です。 Djangoは、Python製のWebアプリケーションフレームワークです。もともとニュースサイトを管理する目的で開発が始まり、2005年7月にOSSとしてリリースされました。 Python Software Foundation（PSF）による調査「P

React＋Reduxによる状態管理とフロントエンドの技術的負債 ─ 長く継続するサービスのアプリケーション設計 遷移なく表示コンテンツを変更できるシングルページアプリケーションでは、ページの状態管理が重要になります。現在はReactによるUI構築とReduxによる状態管理を選択しているChatworkは、jQueryなどの技術的負債と共存しながら、フロントエンド設計の見直しを重ねてきました。クライアントサイド・アーキテクトの火村智彦（@eielh）さんと、エンジニア採用広報の高瀬和之（@guvalif）さんによる解説です。 クラウド型ビジネスチャットツール「Chatwork」は、2011年3月にローンチされて10年以上にわたり開発を継続してきました。このように長く続くサービスがユーザーに価値を提供し続けるには、時間経過による変化に適応するため設計の見直しが必要になります。 しかし、設計を

モジュラモノリスに移行する理由 ─ マイクロサービスの自律性とモノリスの一貫性を両立させるアソビューの取り組み 大規模なソフトウェア開発においてモノリシックかマイクロサービスかというアーキテクチャの議論がありますが、近年は第3の選択肢としてモジュラモノリスが話題になっています。いったんマイクロサービス化に舵を切りながら現在はモジュラモノリスに取り組むアソビューの考え方や進め方について、VPoEの兼平大資（disc99）さんによる寄稿です。 アソビューでは、現在の事業状況にマッチしていることや過去の経緯から、モジュラモノリスを中心としたアーキテクチャを採用しています。 今回は、なぜその選択をし、どのように実現しているかを紹介します。 記事の前半では、アソビューが提供する事業や、アーキテクチャに対する考え方、開発組織の歩みなどを説明します。 中盤以降は、アソビューにおけるモジュラモノリスへの取

ハイクラス求人TOPIT記事一覧RustでWebアプリケーションのバックエンドを開発するには ─ 型システムの堅牢性と柔軟性を業務システムにも！ RustでWebアプリケーションのバックエンドを開発するには ─ 型システムの堅牢性と柔軟性を業務システムにも！ 安全性に大きな特徴があるプログラミング言語Rustは、C言語やC++に代わるシステム記述言語として注目されてきました。しかし、その安全性とパフォーマンスの高さにより、ビジネスアプリケーションの構築にも採用されています。この記事ではキャディ株式会社による事例を紹介します。 こんにちは。キャディ株式会社バックエンドエンジニアの松田と申します。 キャディ株式会社では、「モノづくり産業のポテンシャルを解放する」をミッションとして、製造業分野に関連するさまざまなソフトウェアの開発を行っています。また、そのための主要な開発言語としてRustを採用

ハイクラス求人TOPIT記事一覧WebAssembly入門 ─ Webフロントエンドの現実的なユースケースを知り、Wasm製アプリケーションを体験してみよう！ WebAssembly入門 ─ Webフロントエンドの現実的なユースケースを知り、Wasm製アプリケーションを体験してみよう！ WebAssembly（Wasm）は、ブラウザー上で直接動くプログラミング言語として、JavaScriptを置き換える期待が寄せられますが、実際にWasmが果たすべき役割や適したユースケースとはどういったものでしょうか？ Wasmの動作を体験するチュートリアルとあわせて、山本悠滋（igrep）さんが解説します。 WebAssembly（以下、略称の「Wasm」と呼びます。「キャズム」や「～イズム」などからの類推なのか「ワズム」と発音するようです）とは、ブラウザーをはじめとするさまざまな環境で動作する、仮想マ

GitとGitHubを分かりやすく！ 組織開発で生かすツール選択とプロジェクト進行を解説 分散型バージョン管理システムのGitと、そのホスティングサービスとしてプルリクエストなどの機能をもつGitHubは、ソフトウェア開発環境として広く普及しています。本記事ではGitやGitHubの考え方や使い方の基本を解説するとともに、実際のプロジェクトにおける開発の進め方を簡単に紹介します。 この記事を読み始めているということは、GitやGitHubに興味をお持ちのことでしょう。Gitはバージョン管理システム、GitHubはGitのホスティングサービスで、いずれもソフトウェア開発を中心に利用されています。近年では、2018年にGitHubの運営会社がMicrosoft社によって買収されたことでも話題になりました。 この記事では、GitやGitHubの基本的な使い方や考え方を解説します。また、実際の開発

Reactを取り巻く状態管理の潮流を学ぼう。HooksやServer Componentsなどの登場で何が変わるか Reactを取り巻く状態管理のアプローチは変化を続けていますが、いま知っておくべき手法とはどのようなものでしょうか。小林 徹（@koba04）さんに、現在、そしてこの先の状態管理について執筆いただきました。 こんにちは、小林（@koba04）です。 2019年5月に『SPAにおける状態管理:関数型のアプローチも取り入れるフロントエンド系アーキテクチャの変遷』という記事を書きましたが、そこから2年以上が経過し、Reactを用いた状態管理は大きく変わりました。本記事ではReactを取り巻く状態管理の変遷について解説します。 広がるReduxの採用 Hooksの登場 コンポーネントツリーから独立した状態管理 Concurrent Featuresによる新しいユーザー体験 状態とキャ

ハイクラス求人TOPIT記事一覧ソフトウェアの「アジリティ」と「品質」をトレードオフにしない、プロダクト開発の理想型｜Tably及川卓也×Autify 近澤良 ソフトウェアの「アジリティ」と「品質」をトレードオフにしない、プロダクト開発の理想型｜Tably及川卓也×Autify 近澤良 ソフトウェア開発においても重要なキーワードとなっている「アジリティ」。激しい市場変化への対応力、機敏性を意味する言葉だ。あらゆる産業でソフトウェアを主体としたビジネスへとシフトするなか、その「アジリティ」と「クオリティ」をどう両立するか。そのためのプロダクト開発の理想型とは？ Tably及川卓也氏 × Autify 近澤良氏の特別対談をお届けする。 アジリティがなければ、もはや勝負にならない。 ミニウォーターフォール化する、アジャイル開発の罠 高まる、E2E （End to End）テストの重要性 組織とし

ハイクラス求人TOPIT記事一覧「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ 「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！ エンジニアHubでは2019年に「がんばらないTypeScript」を紹介しました。JavaScriptに静的型付けなどを提供するTypeScriptは、今では実プロジェクトに採用されるプログラミング言語になっています。そこで現実的なTypeScriptの設定を、藤吾郎（gfx）さんに解説してもらいました。 2021年の現在、TypeScriptの価値はますます広く認められるところとなり、多くのJavaScriptプロジェクトがTypeScriptで開発されるようになってきました。またT

Laravel大規模開発入門！MVC分離のFatModel問題に対する責任分離と依存管理、その設計と考え方について ナイル株式会社メディアテクノロジー事業本部の工藤さんにMVC分離のFatModel問題に対する責任分離と依存管理、その設計と考え方について解説いただきました。 こんにちは、ナイル株式会社メディアテクノロジー事業本部で開発マネージャをしています工藤@ta99toです。 今回は大規模で複雑度の高い開発をMVCフレームワークベースで構築する際に僕が課題と捉えているポイントやその具体的な解決手法について解説させていただきたいと思います。 「MVC以上の責任分離イメージがつかないよ！」 「DDDとかクリーンとかオニオンとかあのへんの設計パターンの導入モチベーションが不明」 「どうやっても最終的には複雑になって追加開発や修正開発が怖い状態になっちゃう」 ↑このような悩みを持った方に対して

文字コード再入門 ─ Unicodeでのサロゲートペア、結合文字、正規化、書記素クラスタを理解しよう！ 文字コードには、どのような種類があり、それぞれどのような意味を持つのか、といった、文字コードの基本的な概念、従来の文字コードを紹介し、現在のUnicodeの構成を概説し、プログラミングにおいて注意すべき箇所をいくつか取り上げます。 ソフトウェア開発に携わる方の多くは、何らかの形で文字コードに触れることがあるでしょう。文字や記号をコンピュータ上でデータとして扱うには、文字コードの知識が必要不可欠です。 本稿では、書籍『プログラマのための文字コード技術入門』の著者である矢野啓介さんが、知っておきたい基礎知識を分かりやすく解説します。 文字コードとは？ Unicode以前の文字コード Unicodeとその主な符号化形式 UTF-16 UTF-32 UTF-8 Webで文字コードを指定する仕組み

LINEの技術的負債を解消している話 ─ HTTP/2へのプロトコル変更やデータ同期の最適化での改善 サービス開始から10年近くがたったLINEでは、次の10年のため技術的な負債を解消・改善する取り組みをプロジェクトで行っています。 通信プロトコルをSPDYからHTTP/2に移行 抽象化レイヤーを設置してプロトコル移行のリスクを低減 Long PollingをPushへと切り替えて通信量を最適化 アプリの利用状況に応じて最適なデータ同期の方法を アーキテクチャの改善でアプリの信頼性や拡張性が向上 長い歴史を持つアプリには「技術的負債をどのように解消するか」という課題が常につきまといます。2011年にサービスを開始したコミュニケーションアプリ「LINE」においても同様で、多機能化や、開発・運用の長期化に伴い、いくつもの負債が発生していました。 この課題を解決するため、LINE株式会社では「『

Swiftに足りなかったものを作る - スター数13,000超の「Kingfisher」を生み出したonevcatの着想術 画像を取り扱う軽量なSwiftライブラリ「Kingfisher」が獲得したスター数はなんと13,000以上。圧倒的な支持を集めるOSSを作り続けるonevcatさんに、発想の源を聞きました。 初めて作成したリポジトリが獲得したスター数、8,500以上。 ひとつのリポジトリが獲得した最大のスター数、13,000以上。 この数字を叩き出したのが「1人のエンジニア」だと聞けば、多くの方は驚きの声をあげるでしょう。多くの人から支持されるOSSを作るのはもちろん簡単なことではなく、数千、数万というスターを獲得することは、ほとんど“偉業”ともいえる実績です。 この圧倒的な実績を生み出したのは、ドキュメンテーションコメントを簡単に書けるXcodeプラグインVVDocumenter-

進化の先に理想のエンジニア組織がある─成長のジレンマを解消して進化するフューチャーの組織論 エンジニア組織が成長する際に直面するさまざまなジレンマを解消するうち、ホラクラシー型に進化したというフューチャー株式会社のエンジニア組織論を、宮原洋祐さんに聞きました。 ジレンマを解消しながら進化する組織 専門家とオーナーシップのトレードオフ 組織をリファクタリングしてホラクラシーに近く 組織の形が変わることでエンジニア個人も変わる チーム間の移動を容易にすることで成長を促す 進化の先にある理想のエンジニア組織 インターネットがビジネスに普及する以前から30年にわたり、日本を代表するさまざまな企業に向けたITコンサルティングを通して、企業経営の戦略システム開発を手掛けてきたITの専門家集団、フューチャー株式会社。 企業のパートナーとしてのIT構築を専門としていることから、エンドユーザーの目に触れる機

Microsoft Azure入門 - Web Appsを使って簡単にWebアプリやAPIを公開してみよう Azureに入門するために、まずは手を動かしてみよう！数あるAzureのサービスの中からWeb Apps、Functions、SQL Databaseをチョイスし、これらを組み合わせ、簡単なWebアプリケーションやAPIのサンプルを作成・公開してみます。 Web Apps、Functions、SQL Databaseそれぞれの特徴 Web Apps／Functions／SQL Database Azureを利用するための準備をしよう 開発環境の準備／Azure サブスクリプションの作成 Webアプリケーションを作成する Web API プロジェクトの作成／APIの確認／アプリケーションのデバッグ実行／アプリケーションをホストするWeb Appsの作成 SQL Databaseと連携す