2021-01-01から1年間の記事一覧
はじめまして。最近無性に海外旅行に行きたいと思っているフロントエンドエンジニアの内田です。 Next.jsってページごとに色々なレンダリング方法を柔軟に切り替える事が出来て便利ですよね。 ですが、利用する際にはきちんとそれらレンダリング方法のメリッ…
こんにちは、フロントエンドエンジニアの柳田です。 2020年、新型コロナウイルスの影響で、リモートワーク環境になった方は少なくないと思います。 弊社も同様にリモートワークになり、当初はコミュニケーションが取りづらくなることを懸念していましたが、…
はじめまして、フロントエンドエンジニアの菅野です。 今回は、E2Eテスト自動化の取り組みについてお話ししたいと思います。 E2Eテストとは End to Endを略してE2Eと呼ばれています。 例えば、 CV（コンバージョン）ポイントやログイン機能の動作確認 VRT（…
先日、(2021年3月3日) Gatsby v3.0がリリースされました。 Introducing Gatsby 3.0 – Faster in Every Way that Matters いくつかの変更がありますが、特に気になった項目が V3 for Content Editors: Faster build times on any service (あらゆるサービスで…
AOPとは 背景 横断的関心事（Cross Cutting Concerns） 用語 Aspect（アスペクト） Advice（アドバイス） Join Point（ジョインポイント） Point cut（ポイントカット） その他 Laravelのライブラリ 個人的な印象 Laravelの機能との差 Middleware Listener, …
はじめに GatsbyJsとは何か GatsbyJs導入install WordPressと連動 GatsbyJs側の処理 config設定 記事一覧ページ 記事テンプレート作成 NetlifyでDeploy Netlifyとは何か デプロイ手順 参考イメージ まとめ はじめに 皆さんこんにちは、フロントエンドエンジ…
こんにちは。バックエンドエンジニアの河内です。 今回は、コミットを整理する方法のうち、個人的に使用頻度が高いものについて書きます。 前提方針 コミットログを整えるために編集を加えるのは、ローカルリポジトリのコミットだけとします。 逆に言うと、…
はじめまして、フロントエンドエンジニアの髙橋です。 バーチャルオフィス導入の影響もあり、Wiz社内でのオンラインのLT会やもくもく会などイベントが増えてきております。 その一環でWizでは今期から毎週輪読会を行っており、その内容や感想などをご紹介し…
はじめに 皆様こんにちは、フロントエンドエンジニアの松本です。 本日はWizクリエイティブチームの働き方についてご紹介したいと思います。 現在、Wizクリエイティブチームの全職種（ディレクター、デザイナー、フロントエンド、バックエンド、ライター）は…
バランサーとEC2 デプロイフロー Terraformで実装 前提 ディレクトリ構成 CodeDeploy 必要なリソースのインポート ①インポートしたリソースの定義 ②デプロイアプリケーションとデプロイグループの作成 CodePipeline ①IAMロール作成とポリシーアタッチ ②S3バ…
第2回LT会レポ JSモジュールバンドラのこれからについて考える メモリーを認識したプログラム PHPのInterfaceの使いどころ TypeScript導入のススメ 第2回LT会レポ 今回のLT会の内容は 発表者: 4名 制限時間: 発表時間 5分 + 質問時間 10分 テーマ: 自由 で行…
こんにちは、フロントエンドエンジニアの小玉です。 今回は、Vue.jsにおける状態管理についてお話したいと思います。 Vue2.x時代、多くの方はVuexを使用していたのではないでしょうか？Vue2.x、Vue3.xともに公式のドキュメントにおいても、状態管理のセクシ…
今回はPHPのLaravelで既存画像のWebP化及び切替表示について実装例を紹介してみようと思います。 目的 記事の画像をWebP化することによって記事の表示スピードを早くする。 WebP（うぇっぴー）とは 軽量の新画像形式で開発したグーグルによると、画像をWebP…
今回はPHPのInterfaceの使い所について、例を交えつつ紹介してみようと思います。 本題に入る前にこの記事内のサンプルコードについてです。 サンプルコードは全て、フレームワークにLaravelを使用しているという前提で記述しています。 LaravelでInterface…
こんにちは、フロントエンドエンジニアの松尾です。 2020年10月27日にNext.js10がリリースされ、パフォーマンスを改善するための20個を超える新しい機能が追加されました。 nextjs.org 私たちフロントエンドチームでも、プロジェクトにNext.js10を導入してお…
Lambda@Edgeとは 設定出来るフック 例：webp画像を配信して表示速度高速化したい ①IAMロールを作成 ② Lambda関数を作成 ③関数コードを作成 ④デプロイパッケージを作成 ⑤.zipファイルをアップロード ⑥テストを行ってみる ⑦ Lambda@EdgeをデプロイしCloudFront…
皆さんこんにちは、フロントエンドエンジニアの高野です。 皆さんはJSのバンドラーは何を使われていますか？ 私たちフロントエンドチームでは主にwebpack、一部browserifyを使用しています。 最近はReactやVueをブイブイ使いビジネスロジックをもつことも多…
Laravel7との違い ①ルートファイルの書き方 Laravel7では以下の様な記述でしたが、
こんにちは。フロントエンド の仲本です。 今回はHTML要素に関する型推論について、一般的な型推論からデファルトでは型推論できない場合の対応方法までを紹介いたします。 要素に対する型推論 まずはHTML要素の一般的な型推論を紹介いたします。 <html lang='ja'> <head> <meta charset='utf-8'> <title>sample</title></meta></head></html>…
wizでは現在ブランディング向上施策に力を入れています。 当ブログの開設も施策のひとつです。 さらに施策の一貫としてLT会を開催することになりました。 その狙いと、早速開催した第1回LT会の様子についてご紹介します。 LT会レポはフロントエンドエンジニ…
