※こちらの記事がはてブの総合ホッテントリ入りしました！
※noteの公式マガジンと、「先月もっとも多くスキされた記事」の一つに入りました！

こんにちは。Kazutaka Shimizuです。
フリーランスとしてPM、エンジニアをやっています。

元々はWebマーケティングのコンサルタントをやっていましたが、独学でWeb開発を勉強してWebサービスを作って起業しました。

最近は創業した会社を離れ、フリーランスとして活動したり、プログラミングを独学した経験をこちらのツイッターで発信しています。

Twitterやnoteの他の記事などでもしつこいぐらいに言っていることなのですが、プログラミング学習はある程度基礎を勉強したら、自分でオリジナルのWebサイトやアプリなどを作ってみるのがオススメです。

今までの勉強ではプロダクトにどんな機能が必要か考えたり、それを色々調べながら実装に落とし込んだりすることはしてこなかったと思います。

エンジニアとして仕事をしていく上で、そうした経験や能力は必須であり、それを培うには実際に何か作ってみるのが一番です。

しかし、初心者の人がオリジナルのプロダクトを作るのは中々ハードルが高いですよね。

実際、僕自身も苦労した経験があるのでよくわかります。

そこで、今回はそうしたプログラミング初心者の方が、オリジナルのプロダクトを作る時に使うと便利なツールやサイトをいくつかまとめてみました。

初心者ではなくても個人で何かプロジェクトをやったり、プロトタイプをサクッと作りたいエンジニアの方などにも参考にして頂けると嬉しいです。

こちらの記事に頂いた感想です！

■目次
Canva
Clippy
Keyframes
Prodibi
Netlify
Firebase
Stein
ProductHunt
ServiceSafari
Udemy
Techpit
Qiita
GitHub
Teratail
Menta
Logrocket
Codic
ghkw
Wappalyzer
チャネルトーク
ツクログ
StartApp
おわりに

Canva

レイアウトなどは上記のように様々なサイトのデザインを参考にある程度まとまれば、あとは今まで勉強してきたような形でHTMLとCSSを書いていけば出来上がります。

しかしバナーやアイコン、ロゴなどはそうはいきません。

これらはHTMLやCSSではなくPhotoshopやIlustratorなどのデザインツールを使って作る必要がありますが、いかんせん操作が難しく、きちんと使いこなすにはそれなりの時間勉強する必要があります。

Canvaは先ほどあげたデザインツールよりも遥かに簡単な操作でバナーやアイコンなどを作ることができるツールです。