本記事は 2022年度 新人卒業記念Week 4日目の記事です。 🌸 3日目 ▶▶ 本記事 ▶▶ 5日目 📚 はじめに 1.Udemyでのオンライン学習 2.実務での修正作業 3.新規ページ作成 大変だったこと①：参考となるコードやパーツがない 大変だったこと②：クラス名や共通要素を一から考えなくてはいけない まとめ はじめに 初めまして、入社一年目の小嶋です！現在はWebディレクターを目指して日々修行中です！ 新人卒業記念Weekということで、コーディングがほぼ未経験だった私が、html・cssを使って

はじめに ZOZOTOWN開発本部の武井と申します。ZOZOTOWNのフロントエンドリプレイスプロジェクトを主に担当しております。 ZOZO DEVELOPERS BLOG でも「 ZOZOのリプレイスプロジェクトで得られる唯一無二の経験。大規模サービスを進化させるやりがいとは 」というインタビュー記事を掲載しておりますので、もしよろしければこちらも併せてご覧ください。 さて、本題です。現在ZOZOTOWNではオンプレミスかつ、モノリスだった既存システムをマイクロサービスAPIに責務を分割したり、インフラ

ニフティ株式会社新卒2年目のRyommです。普段はマイ ニフティというスマートフォン向けアプリの開発・運用を行なっています。 ニフティには書籍購入補助制度があり、その管理にbookbotというツールを使っています。 今まで書籍購入補助制度で購入された本とその感想を、bookbotがデータベースに貯め込んでおり、昨年末にNotion連携機能を実装したことで誰でも簡単に閲覧できるようになりました。 そこで今回は、書籍購入補助が始まった2019年から蓄積したデータの分析結果を大公開しちゃいます！ 社内では以下の

はじめに こんにちは! そろそろエンジニア2年目が終わり、3年目を迎えることに恐怖している新垣修一です! 今回はPythonWebフレームワークの一つであるStreamlitを使用して、アプリを作成してみます。 最近技術系の記事を見るとフロントエンドの知識なしで早くアプリを作成できるStreamlitというフレームワークの存在を知り、少し触れてみたいなと思い今回の記事を書かせていただきました。 Streamlitとは Streamlitは、Streamlit社が開発したPythonのWebアプリケーション

LIFULLでフロントエンドエンジニアをしている齋藤です。 2008年入社なので15年目ぐらいの古株です。今は LIFULL HOME'S の賃貸部門でフロントエンド開発をしています。 いきなりですが、みなさんはアイコンをどう実装していますか？ アイコンフォント、スプライト、一つ一つ切り出す。フォーマットもSVG、PNG、Fontなどなど。 実装方法はいろいろありますし、サイト規模や運用体制などでどれが扱いやすいかは変わってきますよね。 たかがアイコン、されどアイコン。 利用頻度が高く、大きさや色が微妙に

プロダクトエンジニアリング部の海老澤です。 普段は LIFULL HOME'S の賃貸部門のフロントエンド開発をしています。 近年、LIFULL の開発部門では「開発生産性」という言葉が取り沙汰されるようになりました。 LIFULL HOME'Sの主要リポジトリは10年以上運用され続け、今も多くの開発者によって日々改修され続けています。 長い年月の中で小さな設計ミスも積み重なって大きくなり、ちょっとした実装でも入念な調査が必要となり開発生産低下の要因となっていました。 また10年以上前に採用したフレームワ

こんにちは、ISID 金融ソリューション事業部の岡崎です。今回はEpicGames社が提供する ゲームエンジン 、 UnrealEngine5 のPlugin「PixelStreaming」を使用し、WebUIからサーバー上のUE5の操作を行いました。 はじめに PixelStreamingを利用してWebUIからUEを操作するためには、UEアプリ上のBluePrintにURLクエリや JavaScript などを紐づける必要があります。 今回は、WebUIとUEアプリの連携をする為の方法について解説しま

日々GitHub上で管理されたファイルを編集していて欠かせないことの1つに「Pull Requestを作る」があります。 Pull Request（以下プルリク）の説明文はMarkdown記法をサポートしているので、箇条書きやWeb上にあるドキュメントへリンクなどを気軽に書くことができます。 ところで、プルリクの説明文やいわゆるREADME.mdのようなMarkdownで書かれた内容は直接GitHub上で表示されるのではなく1、別途HTMLに変換されて表示されます。 プルリク作成の画面ではMarkdown

この記事は、イベント　【 PERSOL（パーソル）グループ Tech Talk #3 - 技術負債との向き合い方 - 】を開催しました。 の発表内容です。 dodaの技術負債を解消する守りのリファクタリングと攻めのリアーキテクティングというタイトルで発表させていただきます。 まず、自己紹介です。私は斎藤悠太と申します。略歴としましては、Sirや事業会社での開発を経験して、2020年にパーソルキャリアに入社しています。現在はdodaの開発に関わっていて、得意な領域は、サーバーサイドからインフラ領域です。言語

こんにちは、XI 本部ソフトウェアデザインセンター所属・新卒 1 年目の松本です。 昨年10月に配属されてから 3 ヶ月間、Atlassian Forge を使った アプリ開発 を担当しました。 そこで今回は、Forge の概要と実際の開発手順を解説していきます。 Forge に関する日本語記事はほとんどなく心細い想いをしたので、本記事が誰かの助けになれば幸いです。 Forge とは UI 構築手法 2 パターン UI kit Custom UI 開発手順の例 到達目標 執筆者の環境 ① Node.js

こんにちは！エンジニアの大林です。 先日セーフィーのエンジニアにアンケートを取ったので、今回はその内容をお届けします。 アンケートのテーマは「新卒エンジニアにおすすめの〇〇は？」ということで、以下の3つについて聞いてみました！ 技術本 技術以外の本 本以外の学習媒体 新卒エンジニアにおすすめの技術本は？ 新卒エンジニアにおすすめの技術以外の本は？ 新卒エンジニアにおすすめの本以外の学習媒体は？ 最後に 新卒エンジニアにおすすめの技術本は？ たくさんの意見が寄せられましたが、中でも多かったのが以下の2冊でし

こんにちは。X イノベーション 本部ソフトウェアデザインセンターの陳です。 この記事ではNext.jsの getServerSideProps の利用でハマったことについて話します。 Server-side Rendering（ SSR ）とgetServerSideProps Server-side Renderingはリク エス トごとにサーバー側で レンダリング を行い、HTMLページを生成する機能です。 頻繁に変更されるデータを画面に表示させたい時はServer-side Renderingを利用

こんにちは。X イノベーション 本部ソフトウェアデザインセンターの陳です。 この記事ではNext.jsの getServerSideProps の利用でハマったことについて話します。 Server-side Rendering（ SSR ）とgetServerSideProps Server-side Renderingはリク エス トごとにサーバー側で レンダリング を行い、HTMLページを生成する機能です。 頻繁に変更されるデータを画面に表示させたい時はServer-side Renderingを利用

こんにちは！スマートキャンプエンジニアの中田（のっち）です。 みなさんWebブラウザには何を使われてますか？ Chrome, Firefox, SafariにEdgeなど多くの選択肢があるWebブラウザですが、私は2ヶ月ほど前に長らく使ってきたChromeから移行し、現在は Arc というbeta版が公開されている新しいWebブラウザを使ってみています。 この Arc がとても便利で楽しいものだったので、本記事ではそんな Arc の紹介 (※普及活動) をしていきます！ Arcとは 概要 インストール方法

こんにちは！ ラク ス１年目の koki _matsuraです。 今回は 掲示 板アプリ作成を通して、SvelteKitの基礎的な部分 をご紹介させていただきます。 目次は下記のようになっています。 はじめに Svelteとは SvelteKitとは 掲示板アプリ作成 アプリの概要 環境構築 SvelteKit データベース Prisma テーブル作成 ルーティング作成 新規登録画面 ログイン画面 スレッド投稿画面 スレッド一覧画面 スレッド詳細画面 ログアウト機能 エラー画面 終わりに はじめに Sve