プロジェクト名： プロドウガ公式サイト
ウェブサイト： [https://prodouga.com/]
使用技術
- Astro: 静的サイトジェネレーター
- TailwindCSS: CSSフレームワーク
- TypeScript: 型付け言語
制作意図
- 最新のWeb技術を学ぶ
- 高速でSEOに優れたサイトを構築
- メンテナンスしやすい構造を目指す
こだわりポイント
- Astro + TailwindCSS + TypeScriptの組み合わせ
- プロジェクト構造の分割と整理
- Dockerによる開発環境構築
まとめ
このプロジェクトでは、モダンなWebテクノロジーを活用しています。具体的には、Astro、TailwindCSS、TypeScriptを使用しています。これらの技術を使用することで、効率的かつ効果的にウェブサイトを構築することができました。
Astroを使用することで、React、Vue、Svelteなどの人気のあるフレームワークを組み合わせて使用することができ、それぞれの長所を活かすことができました。また、Astroは静的サイトジェネレーターとしても機能するため、高速なページロード速度とSEO対策を実現しました。
TailwindCSSはユーティリティファーストのCSSフレームワークで、独自のデザインシステムを構築するのに役立ちました。また、レスポンシブデザインの実装も容易になりました。
TypeScriptを使用することで、型安全性を確保し、バグを未然に防ぐことができました。また、開発効率も向上しました。
このプロジェクトでは、Dockerを使用して環境を構築し、開発からデプロイまでのプロセスをスムーズに行うことができました。また、プロジェクトの構造は整理されており、各部分が明確に分割されているため、メンテナンスが容易です。
以上の経験を通じて、私は最新のWebテクノロジーを活用して効率的かつ効果的にウェブサイトを構築する能力を持っていることを証明しました。これらのスキルと経験は、将来のプロジェクトにおいても大いに役立つと確信しています。
.
├── Dockerfile
├── LICENSE
├── astro.config.mjs
├── netlify.toml
├── package-lock.json
├── package.json
├── postcss.config.js
├── dist
├── public
├── readme.md
├── scripts
│ ├── jsonGenerator.js
│ └── removeDarkmode.js
├── src
│ ├── config
│ ├── content
│ ├── env.d.ts
│ ├── hooks
│ ├── layouts
│ ├── lib
│ ├── pages
│ ├── styles
│ └── types
├── tailwind.config.js
└── tsconfig.json