はじめに こんにちは、インターン生の手塚です。 今回はGROWIにおけるwebpackの設定について、調べてみたので記事にします。この記事はGROWIにおけるwebpackの設定に着目しているのでwebpackの基礎知識や、使い方の詳細は説明していません。webpackについてある程度の知識がある人に、プロジェクトへの活用例として参考にしてもらえればなと思っております。 webpackは設定が複雑で、そのため「webpack職人」と呼ばれる人たちが存在します。本当は、誰もが簡単に設定できるのが理想であり、

Ｃｈｒｏｍｅブラウザにおける強制リロードの方法です。 キャッシュとは 問題点 Ｃｈromeブラウザにおける手順 条件 デベロッパーツールを表示 キャッシュの消去とハード再読み込みを実施 参考 多くの要素をキャッシュから表示した場合 Webサーバーから読み込んで表示した場合 キャッシュとは 多くのWebページは画像やスクリプト、CSSなど複数の要素で構成されています。 そして要素は毎回すべて変更されているわけでもありません。 そこで、Webブラウザは要素（ファイル）を、メモリやディスクにコピーを保存し、変更

2022年3月15日17時00分（UTC）〜2022年3月29日20時00分（UTC）に開催されたpicoCTF 2022にチームとして参加しました。 本記事はそのWriteupとなります。 概要 CTF（Capture the Flag）とは情報セキュリティの知識を使うセキュリティコンテンストの一つです。いくつかのジャンルに分かれており、例えば『リバースエンジニアリングによって実行ファイルの脆弱性をつく』だとか『Webアプリの脆弱性をつく』だとか『ファイル内に隠された情報を抜き取る』だとか、そういった攻

こんにちは。新卒2年目のRYOBALです。 僕は2021年4月クルーズに入社後、未経験ながらも開発研修を通して、サーバーサイドエンジニアとして配属され、1年後に マーケティング 部に異動しました。 今回は未経験からエンジニアとして働いた僕が考える未経験からエンジニアを目指す人が知っておいたほうが良い4つのことについてお伝えしていきます。 これからエンジニアを目指していきたい方、今エンジニアとして働いている方の参考となればと思いますので、是非最後までご覧ください。 ①向き不向きがある プログラミングは正直な

こんにちは、技術 1 課の水本です。 何度か Marp を使って自作のテーマを作成しつつ、スライドを作る機会を経験しましたので、知見をまとめてみることにしました。 Markdown でスライドを作りたいなと考えている方は参考にしてください。 Marp とは 利用前 独自テーマを作りたいなら CSS の理解は必須 画像を多用するなら圧倒的にパワポで作ったほうが早い 基本は VS Code + 拡張機能 で テーマ作成 いきなり個別 CSS ファイルを作ったりしない デフォルトテーマを継承したほうがいい テー

こんにちは、システムエンジニアの kouki です WESEEK では Rails と webpacker を使ったプロジェクトを多数担当しています。今回はその中で起こったトラブルと対処法についてご紹介します 最近では webpacker が公式に引退宣言 を表明したり Rails 7 になり、 jsbundling-rails , cssbundling-rails が台頭してきたり と assets 関連が盛り上がっていますが、まだ webpacker が現役なため、今回は webpacker にフォ

こんにちは。クルーズ株式会社CTOの鈴木です。 以前の投稿で「 フロントエンドのエラー監視Sentyを導入した話 」でSentry導入の話をしましたが、コアウェブバイタルの監視についてもSentryで最近行うようになったため事例共有をしたいと思います。 Core Web Vitalsの重要性 2021年に Google は、Webページのユーザー体験（UX）の向上を目指して、Web Vitalsという概念を導入することを発表し、特に検索の表示順位に影響を与える指標としてCore Web Vitals を定

はじめに 皆さん初めましてseahoseTです。 今回はコンピュータプログラムの記述・編集を行うための ソースコード エディタの一つ『 Visual Studio Code 』、通称『 VSCode 』の最新のインストール事情について紹介していこうと思います。 VSCode のインストールについての過去の記事は Visual Studio Code のインストールと日本語化まとめ をご覧ください。 もくじ はじめに VSCodeとは ここがすごいよVScode ソースコードエディタの歴史 Vim Subl

はじめに こんにちは。2021年新卒の田中です。現在私は、フリーター・既卒・第二新卒など、20代を対象とした就職・転職支援サービス「 ハタラクティブ 」のシステム開発やユーザー体験の改善に携わっています。 ハタラクティブでは、Laravel + jQueryだったフロントエンド環境をReact/TypeScript + Next.jsにリプレイスしました。その際、コンポーネントシステムとしてAtomic Designを採用し、入社1年目ながら選定から設計、導入プロジェクトの管理、運用ルールの構築を任せてい

はじめに こんにちは。WEAR部フロントエンドブロックの藤井です。 WEAR では現在、Webサイトのリプレイスを進めています。本記事では、リプレイスに至った背景や課題と、課題解決のために行ったリプレイスのアーキテクチャ選定についてご紹介します。 なぜリプレイスするのか WEARはサービスローンチしてから約10年が経ちます。これまでローンチ当時の技術スタックのまま開発を続け、サービスを成長させてきました。今後もより継続的にスピード感を持ってユーザーへ価値を届けていくにあたってさまざまな課題があったため、新

こんにちは。株式会社ペライチ の Wraptas 担当の  @nabettu です。 私は普段 Wraptas という 「Notion をヘッドレス CMS にして Web サイトを制作できる NoCode サービス」 を開発・運営しています。 https://wraptas.com/ みなさん Notion は使っていますでしょうか。 Notion は Evernote のようなドキュメント管理にデータベース機能を追加したワークスペースサービスです。 https://www.notion.so/ 私はサ

こんにちは、LIFULLでエンジニアとして働いている中島です。 私は2010年入社なので現時点で12年程同社で働いています。 長い方ではありますが、LIFULL社はそれよりずっと長く歴史のある会社で、多種多様なメンバーがいます。 その中には自分の意思で職種変更をしたメンバーや、自身の職種がそもそも時の流れとともに無くなり、変わらざるをえなかった方々もいます。 本記事では、フロントエンド領域に関わる職種変更に伴い、LIFULLではどのような課題があったか、また、メンバーの技術ギャップを埋めるためにどのような

電通国際情報サービス 、クロス イノベーション 本部、オープン イノベーション ラボの 比嘉康雄 です。今回取り上げるのはTailwind CSS 。 Tailwind CSS は、最近人気急上昇の CSS フレームワーク です。 メジャーなBootstrapなどの フレームワーク は、あらかじめ見栄えの良い コンポーネント が用意されていて、それをカスタマイズします。それに対し、Tailwind CSS は、 CSS の便利なclassが大量に用意されているだけです。それではなぜTailwind CSS

電通国際情報サービス 、クロス イノベーション 本部、オープン イノベーション ラボの 比嘉康雄 です。今回取り上げるのはTailwind CSS 。 Tailwind CSS は、最近人気急上昇の CSS フレームワーク です。 メジャーなBootstrapなどの フレームワーク は、あらかじめ見栄えの良い コンポーネント が用意されていて、それをカスタマイズします。それに対し、Tailwind CSS は、 CSS の便利なclassが大量に用意されているだけです。それではなぜTailwind CSS

はじめまして。d-t-kong です。第二開発部・楽楽販売開発課に所属しております。 今回は Python のWeb アプリ開発 用の フレームワーク である Django の環境構築から、テンプレートを表示するまでの手順をまとめましたので、ご紹介させていただきます。 今回は以下のセクションで説明します。 Django の特徴 環境構築 Django をインストール Django プロジェクト作成 開発用サーバーを立ち上げる データベースをセットアップする Django でアプリケーションを作る 新規アプ