ミッツ

パンが大好きなbboy(ブレイクダンサー)です。 仕事はフロントエンドエンジニアをして…

ミッツ

パンが大好きなbboy(ブレイクダンサー)です。 仕事はフロントエンドエンジニアをしています。

記事一覧

Vite試してみた

ビルドするのが瞬殺なVite環境を試しにつくってみました。 今回、以下フォルダ構成のものを作成しました。複数ページやテンプレートエンジンに対応できるように試みました…

ミッツ
2年前

ポートフォリオに導入しているwebpack

「gulpfile.jsの中身をタスク毎に分割しました!」でwebpackの設定については割愛させていただきましたので、今回はこちらにフォーカスしていきます。(こちらも試行錯誤中…

ミッツ
2年前
3

レスポンシブで使うmixin

自分がレスポンシブで使っているmixinのコードを紹介します。 割り算はDart Sass 2.0.0に対応した書き方にしています。(詳細はこちら) PCでvw指定、SPでvw指定ができるmix…

ミッツ
2年前
4

gulpfile.jsの中身をタスク毎に分割しました

gulpfile.jsの中身をずっとタスク毎に分割できたら、管理しやすいし、かっこいいなぁと思っていて、何度も挑戦しては「あ、無理だ…」っていうのを繰り返していたら、今回…

ミッツ
2年前
7

ちょうど1ヶ月経ちました

はじめまして、ミッツです! 昨日でマークアップエンジニア として入社して、ちょうど1ヶ月経ちました。この写真のノートは仕事のメモ帳です。あこがれのWeb業界に潜り込…

ミッツ
4年前
5
Vite試してみた

Vite試してみた

ビルドするのが瞬殺なVite環境を試しにつくってみました。
今回、以下フォルダ構成のものを作成しました。複数ページやテンプレートエンジンに対応できるように試みましたが、うまくいかず一旦断念。。
いずれ挑戦します

プロジェクト作成手順①プロジェクト作成に下記コマンド入力(npmの場合)

npm init vite@latest

②「プロジェクト名」の入力、「フレームワーク」「テンプレート」の選

もっとみる
ポートフォリオに導入しているwebpack

ポートフォリオに導入しているwebpack

「gulpfile.jsの中身をタスク毎に分割しました!」でwebpackの設定については割愛させていただきましたので、今回はこちらにフォーカスしていきます。(こちらも試行錯誤中ですのであくまでご参考までにどうぞ🙇‍♂️)

フォルダ構造

まず、自分がwebpackで行っていることとしては主にJavaScriptファイルのみのバンドルになります。説明のためにJavaScriptファイル名は実際

もっとみる
レスポンシブで使うmixin

レスポンシブで使うmixin

自分がレスポンシブで使っているmixinのコードを紹介します。
割り算はDart Sass 2.0.0に対応した書き方にしています。(詳細はこちら)

PCでvw指定、SPでvw指定ができるmixin
基本的な計算方法としてはPCとSPともに
デザイン上の数値 ÷ デザイン上の横幅サイズ × 100 (単位[vw])
としています。

今回の例ではPCデザイン1400px、SPデザインが375px

もっとみる
gulpfile.jsの中身をタスク毎に分割しました

gulpfile.jsの中身をタスク毎に分割しました

gulpfile.jsの中身をずっとタスク毎に分割できたら、管理しやすいし、かっこいいなぁと思っていて、何度も挑戦しては「あ、無理だ…」っていうのを繰り返していたら、今回タスク毎に分けることに成功したので記事にしてみました。

今回はタスクを分割することにフォーカスしているので、gulpのプラグイン が非推奨のものだったり、あまりよろしくない書き方をしている可能性もありますので、あくまで参考程度に

もっとみる
ちょうど1ヶ月経ちました

ちょうど1ヶ月経ちました

はじめまして、ミッツです!

昨日でマークアップエンジニア として入社して、ちょうど1ヶ月経ちました。この写真のノートは仕事のメモ帳です。あこがれのWeb業界に潜り込んでの感想として、マジでわからなさの境地です。

まずはここに至るまでの経歴をざっと書こうと思います。
**
子供〜大学編**
生まれも育ちも埼玉で、性格は今もですが真面目でいい人すぎって周りからよく言われます。あと、子供の頃から興味

もっとみる