フロントエンド
今回は先日リリースされたNuxt Bridgeについて試してみたいと思います。
こんにちは、フロントエンドエンジニアの髙橋です。 先日Next.js ConfでNext.js 12は発表されましたね！ 色々な新機能が追加されましたが、新機能のMiddlewareが気になって試してみたのでその使い方などを書いてみようと思います。 middlewareとは？ 公式に…
需要激増中のグロースハッカーという職業について書いてみました。 自分が目指す職業の一つの選択肢として読んでいただけると幸いです。
こんにちは、フロントエンドの益田です。 OJT期間を終えてタスク管理について相談する機会があったので、今回は入社して5ヶ月経った自分なりのタスクの進め方について書いていきたいと思います。 1. 期限を確認する まずは、緊急か緊急でないかの確認をして…
こんにちは、フロントエンドエンジニアの柳田です。 現在、チーム内でドキュメントを作成する機会が多くなってきました。 社内では、様々な方法でドキュメントを作成しているのですが、そのひとつの方法として、静的サイトジェネレータ（Static Site Generat…
E2Eフレームワーク,ライブラリである「TestCafe」と「Playwright」について簡単に比較してみました。
こんにちは、フロントエンドエンジニアの高橋です。 先日Puppeteerを使った業務効率化のツールを作成しました。 その時参考にさせていただいた記事と一緒にその構成についてまとめたいと思います！ Puppeteerをこれから触る方に少しでもお役に立てればと思い…
リモート環境下で行われたフロントエンドエンジニア新人研修について、その内容と振り返りに加えて、エンジニア歴約1年半の自分がメンターとして教育に携わった所感を記したいと思います。
こんにちは、フロントエンドエンジニアの仲本です。 Wizの新プロジェクトにてフロントエンドをReactを使用して実装しました。 新プロジェクトのフェーズ1が終了とフェーズ2の間で一度リファクタリングを行おうと思い今回コードレビュー会を開きました。 コー…
はじめまして。フロントエンドエンジニアの内田です。 最近福岡では日中30℃を超える気温でぐったりです。アイスがとろけております。 さて突然ですが、この記事をご覧になっている皆様はアクセシビリティについて悩んだ事はありますでしょうか？ Wizでは残念…
はじめまして！フロントエンドの久保です。 今回は【営業部 → エンジニア】へジョブチェンジした話を実体験に基づいて書いていきたいと思います。 ジョブチェンジの経緯 単刀直入にいうと新型コロナウィルスです。 今、どういう事？？と思いましたよね。笑 …
研修中、特にCSS設計に苦戦した事もあり、CSS設計について知らない方向けにCSS設計の例やWizで使っているCSS設計をまとめてみました。
こんにちは、フロントエンドエンジニアの菅野です。 4月7日にリリースされたv.1.14.0で待望の機能が追加されました！ 今回はリリースノートをもとにアップデート内容とそれに伴いTestCafeを実装しているプロジェクトのリファクタリングを行なったので、ご紹…
Next.jsでのDynamic Importの使い所について、私がよく使用する２つの使い方についてまとめてみました。
はじめに 皆さんこんにちは、フロントエンドエンジニアのWooです。⚡️ Next.jsの簡単なサーバー内の処理の実装ができたので、Vercelデプロイ基準でNext.jsのServerless Functionsの実装方法を調べてみました。 Serverless Functionsとは? Serverlessを直訳す…
useReducerは様々な場面で活用でき、可読性・パフォーマンス向上に大いに役立ちます。本記事では、useReducerの基本的な使い方と様々な活用法について説明したいと思います。
ド派手なアニメーションからUIのモーションまで、幅広く応用できるイージングについての記事です。
はじめまして。最近無性に海外旅行に行きたいと思っているフロントエンドエンジニアの内田です。 Next.jsってページごとに色々なレンダリング方法を柔軟に切り替える事が出来て便利ですよね。 ですが、利用する際にはきちんとそれらレンダリング方法のメリッ…
はじめまして、フロントエンドエンジニアの菅野です。 今回は、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とは何か デプロイ手順 参考イメージ まとめ はじめに 皆さんこんにちは、フロントエンドエンジ…
第2回LT会レポ JSモジュールバンドラのこれからについて考える メモリーを認識したプログラム PHPのInterfaceの使いどころ TypeScript導入のススメ 第2回LT会レポ 今回のLT会の内容は 発表者: 4名 制限時間: 発表時間 5分 + 質問時間 10分 テーマ: 自由 で行…
こんにちは、フロントエンドエンジニアの小玉です。 今回は、Vue.jsにおける状態管理についてお話したいと思います。 Vue2.x時代、多くの方はVuexを使用していたのではないでしょうか？Vue2.x、Vue3.xともに公式のドキュメントにおいても、状態管理のセクシ…
こんにちは、フロントエンドエンジニアの松尾です。 2020年10月27日にNext.js10がリリースされ、パフォーマンスを改善するための20個を超える新しい機能が追加されました。 nextjs.org 私たちフロントエンドチームでも、プロジェクトにNext.js10を導入してお…
皆さんこんにちは、フロントエンドエンジニアの高野です。 皆さんはJSのバンドラーは何を使われていますか？ 私たちフロントエンドチームでは主にwebpack、一部browserifyを使用しています。 最近はReactやVueをブイブイ使いビジネスロジックをもつことも多…
こんにちは。フロントエンド の仲本です。 今回はHTML要素に関する型推論について、一般的な型推論からデファルトでは型推論できない場合の対応方法までを紹介いたします。 要素に対する型推論 まずはHTML要素の一般的な型推論を紹介いたします。 <html lang='ja'> <head> <meta charset='utf-8'> <title>sample</title></meta></head></html>…
