P
O
R
T
F
O
L
I
O
ご挨拶
message
はじめまして。齋藤と申します。
この度は、ポートフォリオサイトに訪問いただきありがとうございます。
このサイトは、これまでに手がけた制作物、スキルをまとめています。
私自身、まだまだ至らない点がありますが、常に最適解を求めて研鑽を積み、クライアントに寄り添ったエンジニアリングをしていきます。
今後ともよろしくお願いいたします。
message
Web技術
skill
日々進化し続ける技術をキャッチアップするための学びはもちろんのこと、悩みや課題や目標を解決できるよう、クライアントの目線での視点や、使う人のものであることを常に意識して、多角的に捉えられるように研鑽を積んでまいります。
html・css
HTML・CSS・Sass(SCSS)・Bootstrap・TailwindCSS
- 「見やすく、編集しやすく、簡潔に」。
- レスポンシブ(モバイルファーストorデスクトップファースト)
- 内部SEOを意識、且つW3Cに準拠したコーディング。
- SCSSで BEM記法、又は FLOCSSで記述しています。(自作のテンプレート使用)
- svgアニメーション
- Dart Sass・Bootstrap・★TailwindCSS
- TailwindCSSが好きです。
- XD、Figmaからのコーディング
JavaScript・TypeScript
JavaSript・TypeScript・Node.js
- Vanilla JavaScript
- TypeScript
- gulp
- Web Storage(localStorage)
- PageSpeed Insightsのスコア改善(Web Worker等)
Vue・Nuxt
Vue.js(2,3)・Nuxt.js(2,3)・VueRouter・Vuex・Pinia・Vuetify2・Vue
Test Utils・Jest
- Vue2 Nuxt2(Options API)
- Vue3 Nuxt3(Composition API、composables)
- Vite、VueRouter、Vuex、Pinia、Vuetify2
- vue-test-utils + Jest テストコード
- Atomic Design
- Todoアプリ・カレンダー・iTunesのAPIを使用したiTunesSearch・無限スクロール・ページネーション・ドラッグ＆ドロップ機能・スワイプ機能・ログイン機能・等
- 今はVue.js・nuxt.jsが一番好きです。
その他
Git・GitHub・Docker・XD・Figma・Netlify・Cloudflare・GooglePlay
- エディタ：Visual Studio Code
- デプロイ：Netlify、GitHub Pages、Cloudflare
- デザイン：Figma、XD
- Figmaでプロトタイプ、ロゴ制作
- GooglePlayでアプリ配信
- Git/GitHub プルリクエスト
- Ruby の Ruby on Rails チュートリアルを1周程度
- Docker での環境構築
- Markdown記法
skill
制作物
list
読み込み中
読み込み中
Portfolio
HTML/CSS(SCSS)/Vuetify/Nuxt.js
- レスポンシブ(MF)
- CSS設計はBEM記法
- ライブラリ(vue-typer, vue-parallax-js, @mdi/js)
- デザインは引き算
- OPアニメーション
- ヘッダー(色変化)・バーガーメニュー・ボトムナビ・ページ内リンク
-
★FirstView★clickやマウスを動かしてみてください。
- ★タイトルはランダム(方向、回転)に弾けます。
- svg操作・波紋・影・マウスストーカーetc...
- スクロールfadeアクション 5種類
- listページのモーダルの見やすさを工夫
- パンくずリスト
- ★フォームはgoogleフォームと連携・スプレッドシートで管理・受付時に自動返信メール・入力チェック・確認ページ・完了ページ★
- ナビゲーションガード
- sitemap
- Google Analytics ｱﾅﾘﾃｨｸｽ導入
- Google Search Console ｻｰﾁｺﾝｿｰﾙ導入
- SSG（Static Site Generator）
- Netlifyでの公開
- PWA化（Progressive Web Apps）
- Jest ＋ vue-test-utils でのテストコード記述
コードの詳細: GitHub
各種リンク
- 【記事】
- 【CrowdSourcing】
list
contact