プログラミング独学で起業した僕が、「駆け出しの時に知りたかった...」と後悔してるWeb開発向けツールまとめ

※こちらの記事が「先月もっとも多く読まれたノート」の一つに入りました。ありがとうございます!


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

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

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

✔︎この記事の内容
実務、学習のため問わず、Web制作をするに当たって便利なツールと使いかたをご紹介します

3年ほど独学でWebサービスを作り運用したり、フリーランスとしてお客さまのサイトを作る中で、様々なツールを見つけました。

初心者の方ほどこうした作業効率が上がるツールを知っていた方がいいと思うのですが、周りにエンジニアがいないため情報が流れてこなかったり、知識が浅いため自分で検索し見つけることも難しいです。

僕自身、今回紹介するツールや使い方は、プログラミングを始めた時はほとんど知らず、見つけた時は

「これもっと早く知っていれば・・・!」

と悔しくなったものばかりです。

✔︎このnoteが役に立つ人
・エンジニアとして就職したり、フリーランスになりたくてWeb制作を勉強中の方
・Web制作の実務に携わって、1~3年ぐらいの方

どちらかというと勉強中や、駆け出しの初心者の方向けの内容となっています。
基本的にWeb制作、特にHTML/CSSなどのフロントエンドに関するものが多めです。

現在21個のツールを紹介しており、今後も随時追加していきます!
※macOS以外の環境の方は、利用できないツールもございます

✔︎この記事に頂いた感想

この続きをみるには

この続き:17,382文字/画像30枚
この記事が含まれているマガジンを購入する
全て単品で買うと7000円のところを、マガジンで購入すると45%お得です。 割引額が一番高いマガジンになります。

1000はてブ以上の記事、noteの公式マガジンに掲載されたプログラミング学習記事の他に、1年でTwitterのフォロワーを30倍、6...

全て単品で買うと4000円のところを、マガジンで購入すると50%お得です。 今後値上げする可能性があるため、早めの購入がおすすめです。

1000はてブ以上の記事、noteの公式マガジンに掲載されたプログラミング学習の記事が6記事含まれてます。

または、記事単体で購入する

プログラミング独学で起業した僕が、「駆け出しの時に知りたかった...」と後悔してるWeb開発向けツールまとめ

かずたか@プログラミング独学して起業した人

999円

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

587

【50%OFF】プログラミング学習関連のnoteまとめ

1000はてブ以上の記事、noteの公式マガジンに掲載されたプログラミング学習の記事が6記事含まれてます。
17つのマガジンに含まれています

コメント7件

ご指摘ありがとうございます。
仰る通りかなり広義な意味で「プログラミング」という単語を使ってしまっておりました。
その結果誤解を招いてしまい、大変申し訳ございません。

ご指摘いただいたタイトルの部分は先ほど修正させていただきました。
非常に参考になりました!
紹介されているツールをいくつか導入して、作業が効率化できて助かっています。
ありがとうございます。

✔️デベロッパーツール 上で編集したcssをそのまま保存
について、私の環境では同様の方法でsassの保存ができないのですが、
かずたかさんはChromeの開発ツール上でのCSSの編集をsassにどう反映していますでしょうか。コメント欄での質問で恐縮ですがよろしくお願いいたします。
まこたろくさん、記事の購入とご質問ありがとうございます!
効率化のお手伝いができてるとのことで大変嬉しいです!

なるほど、ご自身のプロジェクトのディレクトリに、〇〇.css.mapというファイルは作成されておりますでしょうか?
ご返信ありがとうございます。

プロジェクト内のCSSディレクトリ内にstyle.css.mapがあります。
なお、ディレクトリの構成は以下の通りです。
.
├── index.html
├── css_dir
│ ├── style.css
│ └── style.css.map
└── sass_dir
│ ├── style.scss
├──prepros-6.config
├── package-lock.json
├── package.json
├── node_modules
├── gulpfile.js
├── images_dir
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。