くるしば | Udemyベストセラープログラミング講師
@shiba_program
Followers
18,474
Following
253
Media
1,198
Statuses
4,186
プログラミング独学→半年でWebサービスを作り起業 /ベンチャー2社と個人事業を創業、売却 / たまに専門学校講師 /プログラミング学習やIT職の生産性を上げるハックなどについて発信 / React、FlutterのUdemy講座を公開しベストセラー入り / ↓発行してるUdemyクーポン一覧は「さらに表示」から
↓今だけ90%オフクーポンつき！Udemy React講座
Joined August 2022
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
LINGORM OPPO A3 MISSION
• 842873 Tweets
バニーの日
• 258713 Tweets
ゲリラ豪雨
• 159968 Tweets
Obamas
• 138446 Tweets
Vote Harris
• 129512 Tweets
アルバム
• 128909 Tweets
#EMPIRE
• 99994 Tweets
Lijo
• 78113 Tweets
Sterling
• 75774 Tweets
Cristiano Ronaldo
• 73175 Tweets
Maresca
• 65522 Tweets
Hermosilla
• 55955 Tweets
ドームツアー
• 47137 Tweets
Young Boys
• 45264 Tweets
ALWAYS 8Y JAEMIN SIDE
• 42500 Tweets
#GeForceSummer
• 27557 Tweets
Manuel Neuer
• 26437 Tweets
El PRO
• 18846 Tweets
オリエント工業
• 18663 Tweets
Dorian
• 18443 Tweets
Gringo
• 17762 Tweets
ドゥレッツァ
• 16835 Tweets
Estadounidense
• 15952 Tweets
FOMC
• 14608 Tweets
シティオブトロイ
• 11536 Tweets
#乃木坂46ANN
• 11339 Tweets
Velasco
• 10030 Tweets
ハーバード大のプログラミングの授業が、無料、日本語字幕で公開されてて有益すぎ
・HTML/CSS/JS
・Git
・バックエンド
などの世界最高峰の授業が見れる
学習熱心な皆さんなら、年末年始はこれを見て過ごすしかない
9
654
6K
ハーバード大のプログラミングの授業が、無料、日本語字幕で公開されてて有益すぎ
・HTML/CSS/JS
・Git
・バックエンド
などの世界最高峰の授業が見れる
学習熱心な皆さんなら、GWはこれをみて過ごすしかない
他にもこのプログラミング学習コンテンツオススメ！ってのがあればリプで教えて！
2
440
4K
画像をアップロードするとHTML/CSSを自動で生成する「Frontly」が凄すぎる
できたサイトをさらにHPビルダーっぽくコードを書かずに編集可能
デザインデータではなく画像から生成できるので、自分が作りたいものに近いサイトのスクショをとってそれを編集すれば爆速でHPが作れてしまう...
（悪用厳禁)
4
537
3K
すごいツール見つけた
画像や動画上のテキストを範囲選択するだけで簡単にコピペできる「Blackbox」
YoutubeやUdemyなど動画内のコードを「コピーできたらな...」と思うシーンめちゃ多いのでこれは嬉しい...
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
11
558
3K
これマジですごい
サイトURLを入れるとその情報をChatGPTに読み込ませられるフォーマットにしてくれる「GPT-Crawler」
例えばあなたがReactを勉強してるなら、Reactの公式ドキュメントを読み込みChatGPTにインポートする
するとReactについて何でも聞けるGPTが完成
どんなジャンルの学習にも使える
1
318
3K
VSCodeの新機能、「StickyScroll」が超便利
長い関数やクラス、cssのプロパティを見る際に、その名前を画面上部に固定してくれるため、自分がコードのどの部分を読んでるか一目瞭然ですぐ分かる
これはコードリーディング捗りそう
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
5
374
3K
これマジですごい
サイトURLを入れるとその情報をChatGPTに読み込ませられるフォーマットにしてくれる「GPT-Crawler」
例えばあなたがReactを勉強してるなら、Reactの公式ドキュメントを読み込みChatGPTにインポートする
するとReactについて何でも聞けるGPTが完成
どんなジャンルの学習にも使える
4
306
2K
スマホをかざすと目の前の物をPCにデータとして取り込み素材にできる「Clip Drop」がすごすぎる
物だけじゃなくノートに書いてあるテキストなどもOCRしつつ取り込むことができる
写真から物体を抜き出す部分をAPIとして公開してもいるみたい
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
3
409
2K
ハーバード大学が無料で公開しているプログラミングの授業
Webやアプリ開発はもちろん、ゲームやAIに関しての授業もある
ハーバードの学費は年間800万とかするようなので、これを無料で受けれちゃうの申し訳ない気もする...
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
5
337
2K
とうとう出てきた、AIを内蔵した次世代コードエディタ「Cursor」
プロジェクトやライブラリのコードを手軽に読み込ませ、コンテキストを理解させた上で
・コードに関する質問や相談
・テストコードなどの自動生成
・コードの微修正
などが可能
VSCodeをベースに作られているので使いやすさも◯
7
409
2K
古いコードを新しいフレームワークなどに自動で移行してくれる「Grit」がすごい
・javascriptをtypescriptへ
・Reactのクラスコンポーネントを関数コンポーネントへ
などがデモにのってる
これフレームワークやライブラリのバージョン更新作業もそのうちやってくれそうな感じあって期待
9
337
2K
VSCode上で爆速で図を書くことができる「Mermaid Graphical Editor」が超便利
テキストとGUI両方で図を書くことができるので、シーケンス図やER図をぱっと作ったり、設計時の頭の中の整理に良さそう
開発中にVSCode上でシームレスに使えるのがほんとに助かる
1
422
2K
東大が無料で公開してる「コードで学ぶAWS入門」が超有益
・クラウド、AWSの基礎
・Dockerも使う
・AWS上で機械学習を行い、手書き文字の認識
・簡単なWebサービスをAWSにデプロイ
この内容、ボリュームで無料なの神だな
インフラは初心者向けの情報が比較的少ないのでありがたい
3
290
2K
ハーバード大のプログラミングの授業が、無料、日本語字幕で公開されてて有益すぎ
・HTML/CSS/JS
・Git
・バックエンド
などの世界最高峰の授業が見れる
ハーバードの学費は数千万かかるらしいので、無料で見れるのなんだか申し訳なくなる...
1
199
2K
多くの駆け出しエンジニアがVSCodeを使ってると思うんだけど、StickyScroll機能使ってる？
長い関数やクラス、cssのプロパティを見る際に、その名前を画面上部に固定してくれる
自分がコードのどの部分を読んでるか一目瞭然ですぐ分かるぞ
これはコードリーディング捗る
7
199
2K
Webに関わる人はぜひ知っといて欲しい
URLを入れたサイトの各ページのスクショを自動で撮影する「Visual Sitemaps」がやばすぎる
競合や類似サイトの構造やレイアウト、機能をまとめてサイトマップを作る作業を完全に自動化
競合の機能やUI調査の時間が1/10ぐらいになりそう
0
222
2K
古いコードを新しいフレームワークなどに自動で移行してくれる「Grit」がすごい
・javascriptをtypescriptへ
・Reactのクラスコンポーネントを関数コンポーネントへ
などがデモにのってる
これフレームワークやライブラリのバージョン更新作業もそのうちやってくれそうな感じあって期待
7
278
2K
合計300時間分のプログラミング学習教材が無料で公開されてる「CRI Boot Camp」
・HTML/CSS/jQuery
・Git
・デザイン
・Vue.js
・PHP/Larabelによるバックエンド開発
など、Web開発に関してまるっと網羅した教材が全部無料なの意味わからん
Slackのコミュニティもあって無料で質問できるらしい...
6
198
2K
サイバーエージェントが公開してる新卒向けのSQL研修資料すごいな
基本的な文法からDB設計、インデックスなどパフォーマンス絡みのことまで書いてある
完全な初心者から実務でSQLを使い始めた人まで、広い範囲の人に有益
僕も最近SQL書いてないのでこの機会に復習してみようかな
3
229
2K
サイトのURLを入れるだけで、自動でそのサイトのページのスクショをとってサイトマップを作る「VisualSiteMaps」がすごすぎ
競合や参考にするサイトの調査で必ずやるフローだが、自分でやると膨大な時間がかかる
VisualSiteMapsを使えば全て自動
PM、デザイナーは大助かりの超有用ツール
1
223
2K
AIコードアシスタントの「Codium」がやばい
VSCode上から起動して選択したコードの
・内容の説明
・修正の提案
・テストの作成、実行
などを自動でやってくれる
しかもこれで個人利用無料とか神すぎる...
有料プランになるとプルリクの自動生成とか、チームコラボレーションに必要な機能が使える
4
179
2K
AIがおしゃれなロゴを作ってくれる「Looka」
ロゴ生成AIは結構あるが、Lookaは作ったロゴから
・名刺
・SNS用の画像
・プレゼン資料
・チラシ
・Webサイト
などなど、ブランディングに必要なあらゆる道具も簡単に作れるのが特徴
これ個人でやってるお店とかには超有用なのでは...！
0
213
2K
またやばいツール見つけた
URL入れるとそのサイトそっくりなデザインをfigmaで作ってくれる「」
参考サイトをインポートしてfigmaでいじったら、エンジニアでもデザイン作れそう
ちょっと悪用が心配...
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
0
206
2K
1
184
2K
Web制作に関わる人はぜひ知っといて欲しい
URLを入れたサイトの各ページのスクショを自動で撮影する「Visual Sitemaps」がやばすぎる
競合や類似サイトの構造やレイアウト、機能をまとめてサイトマップを作る作業を完全に自動化
競合の機能やUI調査の時間が1/10ぐらいになりそう
1
177
2K
僕がプログラミングを独学し起業した頃と比べて、教材もツールも本当に便利なものが増えました
では今初心者に戻ったらどう勉強するか？と最近考えていたのをnoteにまとめてみました！
25000字弱と長いですが、ぜひ読んでみてください！
#駆け出しエンジニアと繋がりたい
7
181
1K
久々にマジの神サービス見つけた
いろんなUIパーツのコード、Figmaデータが無料で使える「uiverse」
とにかく使えるパーツのクオリティが高すぎてビビる
コードもデザインデータも使えるの、ポートフォリオ作るのに有益すぎ
お題に合わせたパーツを作るコンペティションのような機能もある
2
133
1K
Web制作に関わる人はぜひ知っといて欲しい
URLを入れたサイトの各ページのスクショを自動で撮影する「Visual Sitemaps」がやばすぎる
競合や類似サイトの構造やレイアウト、機能をまとめてサイトマップを作る作業を完全に自動化
競合の機能やUI調査の時間が1/10ぐらいになりそう
2
138
1K
プログラミングを学ぶなら絶対チェックしといたほうがいいGithubリポジトリまとめ
Githubに公開されているものは世界中のエンジニアが編集、レビューを繰り返しているので質が高く、issueで質問することなどもできて有用
2
153
1K
2
111
1K
「そのコードが何をしてるか」で検索できる検索エンジン「buildt」がすごい
普通変数や関数名などで検索をかけるが
「ユーザーがログインしているかどうか」
というように、コードが何をしているかで検索できる
大人数で開発してたり、自分で書いたコードが少ないプロジェクトはめちゃ助かる...！
3
149
1K
まさにこういう基礎と応用のブリッジのために作ったUdemy講座なので、このレビュー嬉しすぎる....
0
50
1K
実際のアプリやWebサイトのデザインが8000ページ以上集められた「Refro」
Airbnbなど実在の有名アプリのUIが見れて、画像としてダウンロードすることもできる
マジでこういうサイト増えてるから、個人開発やポートフォリオなどもエンジニアが自分でデザインするハードルが下がってる
3
125
1K
ソースコード特化の検索エンジン「Sourcegraph」、コードリーディングが10倍捗る
GithubやGitlabなどのpublicリポジトリを爆速で横断検索
定義元へのジャンプや関数などがどのファイル、どの部分で使われてるかなども見れる
勉強や実装方法などで迷った時にpublicリポジトリを参考にする時に超便利
0
153
1K
読み込ませたコードの内容を要約し、コメントを書いてくれる「Mintlify」がすごい
VSCodeの拡張機能を入れて欲しいコードを選択すると、それなりに長いコードでも即コメントを入れてくれる
コメント、書いた方がいいのはわかってても面倒に感じることはあるのでこれは助かる
なんと無料で使える
1
162
1K
直感的な操作で既存サイトのCSSをいじり、見た目を変更できる「VisBug」がすごい
テキストや位置、色やシャドウなどの変更もできる
非エンジニア向けデベロッパーツールという感じ
PMやデザイナーの人は重宝しそう
マークアップの知識があっても、簡単な変更だとこちらの方が楽そう
0
213
1K
VSCode上でお手軽に色んな図が書けちゃう「drawio」
ER図やクラス図などの、エンジニアなら書きがちな図はテンプレートがあり、超簡単に作れる
複雑な概念などをこれで作図して記録しておけると、学習にしても仕事で何かを説明する際にもかなりやくに立ちそう
2
188
1K
「そのコードが何をしてるか」で検索できる検索エンジン「buildt」がすごい
普通変数や関数名などで検索をかけるが
「ユーザーがログインしているかどうか」
というように、コードが何をしているかで検索できる
大人数で開発してたり、自分で書いたコードが少ないプロジェクトはめちゃ助かる...！
2
136
1K
VSCode上でお手軽に色んな図が書けちゃう「drawio」
ER図やクラス図などの、エンジニアなら書きがちな図はテンプレートがあり、超簡単に作れる
複雑な概念などをこれで作図して記録しておけると、学習にしても仕事で何かを説明する際にもかなりやくに立ちそう
1
117
1K
これで無料はマジ？
デザインからHTML/CSSコーディングまで幅広く学べる「chot. design」
・デザイン基礎
・Figmaなどのツール
・HTML/CSS
・Wordpress
・実践的なサイト、LPの制作
などなど、本当に幅広くコンテンツがある
Web制作ができるようになりないなら、これ一つで十分足りそう
4
157
1K
figmaやXDのデザインから自動でコード生成する「Locofy」が凄すぎる
生成できるコードはHTML/CSS、React、Next.js、React Nativeなどwebもアプリも両方可能
FlutterやVueにも近日対応するみたい
知ってる中では過去イチのdesign to codeツールかも...
#駆け出しエンジニアと繋がりたい
2
151
1K
プログラミング学習初心者におすすめのGithubリポジトリまとめ
MicrosoftやAirbnbのようなトップ企業が提供する学習コースやスタイルガイドもあれば、世界中の様々な会社のエンジニアがみんなで便利なリソースをまとめたリポジトリもある
どれも数万~数十万ぐらいスターがついており、質が高い
0
123
1K
YoutubeやUdemyなど動画でプログラミング学習するなら絶対必要な超絶便利ツール「Blackbox」
画像や動画上のテキストを範囲選択するだけで簡単にコピペできる
動画内のコードをコピーしたい時死ぬほどあるのでこれはありがたい...
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
1
147
1K
フロントエンドを勉強してるなら、HTML,CSS,jsを使ったコンポーネントやレイアウトのコードが集まった「web. dev」を知らないのはヤバすぎ
実務でもそのままコピペで使える品質
フロントエンド勉強するなら、これらのコード真似してみると良い
Googleが提供してるコンテンツだけあって質が高い
1
111
1K
デジタル庁が公開してるデザインシステムが有用すぎる
・スタイルやレイアウトの規約
・さまざまなコンポーネント
・テンプレート
・イラストやアイコンなどの素材
これらのFigmaデータが無料で公開されてる
勉強になるのもそうだが、出典なしで商用利用までOKなライセンスなの太っ腹すぎだろ...
0
162
1K
フロントエンドを勉強してるなら、HTML,CSS,jsを使ったコンポーネントやレイアウトのコードが集まった「web. dev」を知らないのはヤバすぎ
実務でもそのままコピペで使える品質
フロントエンド勉強するなら、これらのコード真似してみると良い
Googleが提供してるコンテンツだけあって質が高い
1
120
1K
2
103
1K
あのNetflixにそっくりなサイトを実際に作りながらReact + Typescriptを学べる「Netflixのクローンを作るチュートリアル」
本格的な見た目で実際にさまざまな映画の情報をAPIから取得して表示するものが作れるが、解説が丁寧でかなり初心者にわかりやすい内容
入門書の後はこれをやるといいかも
2
108
992
AIによるコード解析ツール「Figstack」がやばすぎてドン引きしてる
・そのコードが何やってるか英語で説明
・別のプログラミング言語に変換
・ドキュメントを作成
これらを自動でやってくれる
学習にも実務にも無限に使い所ある...
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
2
164
984
VSCodeの「StickyScroll」使ってる？
長い関数やクラス、cssのプロパティを見る際に、その名前を画面上部に固定してくれる
自分がコードのどの部分を読んでるか一目瞭然ですぐ分かるぞ
これはコードリーディング捗りそう
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
1
122
987
サイバーエージェントが公開してる新卒向けのSQL研修資料すごいな
基本的な文法からDB設計、インデックスなどパフォーマンス絡みのことまで書いてある
完全な初心者から実務でSQLを使い始めた人まで、広い範囲の人に有益
僕も最近SQL書いてないのでこの機会に復習してみようかな
1
101
980
ソースコード特化の検索エンジン「Sourcegraph」、コードリーディングが10倍捗る
GithubやGitlabなどのpublicリポジトリを爆速で横断検索
定義元へのジャンプや関数などがどのファイル、どの部分で使われてるかなども見れる
勉強や実装方法などで迷った時にpublicリポジトリを参考にする時に超便利
1
106
989
AIによるコードの自動補完、コメントの自然言語からコードを生成できる「codeium」
Github Copilotとかと比べても、遜色ないぐらい補完のクオリティが高い
サードパーティーのAPIに関するコードの補完もいい感じ
他にも単体テストの生成もやってくれる
初期ユーザーは永久無料で使える
4
96
973
CSS全般がまとまってるチートシート
各プロパティがカテゴリごとにまとまってるのはもちろん
・セレクタ
・サイズの指定
・ボックスモデル
なども含まれる
特にボックスモデルは超重要で、これをしっかり理解しないと応用が効かない
HTML/CSS学習したてのうちはこまめに参照するといい
2
125
967
AIコーディングアシスタントの「Rubberduck」がすごい
・チャット形式で開発に関するトピックを相談
・指示した内容のコードを生成/編集
・コードの説明
・テストの生成
・エラーやバグのチェック
などをAIが自動でやってくれる
VSCodeの拡張機能はオープンソースになっており、全て無料で使える
6
149
960
東京大学が無料で公開してる「コードで学ぶAWS入門」が凄すぎ
・クラウド、AWSの基礎
・Dockerも使う
・AWS上で機械学習を行い、手書き文字の認識
・簡単なWebサービスをAWSにデプロイ
この内容、ボリュームで無料はびっくり
インフラは初心者向けの情報が比較的少ないのでありがたい
1
126
948
「そのコードが何をしてるか」で検索できる検索エンジン「buildt」がすごい
普通変数や関数名などで検索をかけるが
「ユーザーがログインしているかどうか」
というように、コードが何をしているかで検索できる
大人数で開発してたり、自分で書いたコードが少ないプロジェクトはめちゃ助かる...！
1
95
972
ググって中々問題が解決できないプログラミング初心者必見！
プログラミングに特化したAI型検索エンジン「Phind」がエグい
質問に対して
・検索結果の要約
・実装方法
・サンプルコード
・出典
などを複数出す
そして何よりも回答を深ぼれるのが初心者にとって最高
マジでメンターに質問してる感覚
2
126
948
Microsoftが作ったVS Codeベースのプログラミング学習コンテンツ「Visual Studio Code for Education」がすごい
PythonやJS、HTML/CSSなどの本格的な学習コンテンツをVS Codeベースの環境で実行し学習できる
プログラミング学習だけでなく、コードエディタの操作にも一緒に慣れることができて良さげ
3
102
937
久々にマジの神サービス見つけた
いろんなUIパーツのコード、Figmaデータが無料で使える「uiverse」
とにかく使えるパーツのクオリティが高すぎてビビる
コードもデザインデータも使えるの、ポートフォリオ作るのに有益すぎ
お題に合わせたパーツを作るコンペティションのような機能もある
1
74
926
Facebook（Meta）のエンジニアが使ったプログラミング学習サービス「Recursion」が凄すぎ
日本語のサービスとしてはかなり珍しく、本格的なコンピュータサイエンスが学べる
日本はCSの知識が薄くても比較的エンジニアになれるが、メガベンチャーや外資など、良い条件の職を探すなら必須
2
106
926
1
86
916
YoutubeやUdemyなど、動画でプログラミング学習してる人は絶対見て
画像や動画上のテキスト部分を選択するだけで簡単にコピペできる「Blackbox」
講義の動画内のコードをコピペしたい時に超便利
動画内のコードを真似してるはずなのに動かない..と悩むことがなくなる
4
125
905
Web制作に関わる人は必読
デジタル庁が作成した「ウェブアクセシビリティ導入ガイド」の内容がわかりやすい
アクセシビリティの概念から具体的にどういった部分を気をつけて改善するかなどが、図を豊富に使ってまとめられてる
エンジニアだけでなく、ディレクターやデザイナーも読むべき
1
101
913
文章から写真を自動で生成してくれる「Playground AI」が凄すぎる
カフェでパソコンを触る女性、といった素材に使われがちな写真も高いクオリティで作ってくれる
また既存の写真をインポートして、テキストで指示を出して編集することも可能
動画では写真の中の柴犬にサングラスをかけてみた
0
105
881
合計300時間分のプログラミング学習教材が無料で公開されてる「CRI Boot Camp」
・HTML/CSS/jQuery
・Git
・デザイン
・Vue.js
・PHP/Larabelによるバックエンド開発
など、Web開発に関してまるっと網羅した教材が全部無料なの意味わからん
Slackのコミュニティもあって無料で質問できるらしい...
4
108
878
これはとんでもないのがきたぞ
MicrosoftがGPT-4を採用したコーディング支援AI「GitHub Copilot X」を発表
・エディタ上でコードに関して質問や修正などをお願いできる
・テストの自動生成
・プルリクの説明を自動生成
・ドキュメントを学習し、回答を生成
などなど、開発体験が大きく変わりそう...
2
134
868
これポートフォリオ作成で使えそうだが、ちょっと悪用が心配なレベルのツール
URL入れるとそのサイトそっくりなデザインをfigmaで作ってくれる「html .to.design」
参考サイトをいくつかインポートし、figma上で組み合わせて編集したら誰でもそこそこのデザインが作れそう
丸パクリはあかんぞ
2
88
880
サイバーエージェントのSQLの研修資料が無料で公開されててためになる
データベースってなんぞやというところから解説してくれて
・insertやselectなど基礎的な文法
・Joinなど結合周り
・トランザクション
・DB設計/ER図
・インデックス
などが図解と例題豊富に解説されてて神すぎる
1
97
872
コード同士の依存や関係を可視化してくれる「ZEVO」がめちゃすごい
リポジトリを読み込ませると、数分程度でどの部分が何に関係してるのか視覚的に表現してくれる
これは既存コードのキャッチアップやリファクタに超便利
プルリクの差分を可視化してレビューのヘルプをしてくれる機能もある
3
97
862
コードを書かず直感的にCSSを作れるツールまとめ
イメージのすり合わせが難しいアニメーションやシャドウなどを、コードを書いてはリロードを繰り返して微調整するのは結構大変
もはやデザイナーに使ってCSSを生成してもらうとだいぶ捗る
1
84
859
東大が無料で公開してる「コードで学ぶAWS入門」が超有益
・クラウド、AWSの基礎
・Dockerも使う
・AWS上で機械学習を行い、手書き文字の認識
・簡単なWebサービスをAWSにデプロイ
この内容、ボリュームで無料なの神だな
インフラは初心者向けの情報が比較的少ないのでありがたい
2
108
858
Next.js、Node.jsを使ってフルスタックのNetflixクローンを作る「Full Stack Netflix Clone」がえぐい
機能はもちろん、UIも超絶質が高くて全てが本格的
全体で8時間の解説動画がなんと無料
英語のコンテンツだが絶対見る価値がある
これが理解できればかなりレベルの高いポートフォリオが作れる
3
80
844
絶対悪用厳禁！
URL入れるとそのサイトそっくりなデザインをfigmaで作ってくれる「html .to.design」
これは参考サイトをいくつかピックアップしてインポートし、figma上で組み合わせたら誰でもそこそこのデザイン作れそう
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
1
107
840
これで無料はマジ？
デザインからHTML/CSSコーディングまで幅広く学べる「chot. design」
・デザイン基礎
・Figmaなどのツール
・HTML/CSS
・Wordpress
・実践的なサイト、LPの制作
などなど、本当に幅広くコンテンツがある
Web制作ができるようになりないなら、これ一つで十分足りそう
2
110
839
初心者が敬遠しがちな正規表現のチートシート
正規表現は記号などが多いので、見た目的にはかなりハードル高い
でも結構あちこちで使うので、早めに苦手意識を消しといた方がいい
僕も最初だいぶ苦手だったけど、このシートがあったらもっとサクッとマスターできてたかも
1
74
840
コードの修正もAIがやる時代に
コードを読み込ませるとAIが自動で検証→改善をバグがなくなるまで繰り返して修正する「Wolverine」
どんなバグが起きたのかの説明、そして修正したコードの差分なども表示してくれる
修正や最適化のサイクルをAIが独力でやってしまうのか....
3
102
805
読み込ませたコードの内容を要約し、コメントを書いてくれる「Mintlify」がすごい
VSCodeの拡張機能を入れて欲しいコードを選択すると、それなりに長いコードでも即コメントを入れてくれる
コメント、書いた方がいいのはわかってても面倒に感じることはあるのでこれは助かる
なんと無料で使える
1
75
807
日本だとあまり知られてない海外のプログラミング学習コンテンツまとめ
SQLやアルゴリズムをインタラクティブに学べるコンテンツは個人的にすごく欲しかったのでありがたい
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
1
100
791
実際のアプリやWebサイトのデザインが8000ページ以上集められた「Refro」
Airbnbなど実在の有名アプリのUIが見れて、画像としてダウンロードすることもできる
マジでこういうサイト増えてるから、個人開発やポートフォリオなどもエンジニアが自分でデザインするハードルが下がってる
1
84
794
URLを入れたサイトの各ページのスクショを自動で撮影する「Visual Sitemaps」が超便利
競合や類似サイトの構造やレイアウト、機能をまとめてサイトマップを作る作業を完全に自動化
自社開発、受託どちらでも生産性が上がりそう
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
0
94
781
HTML,CSS,jsを使ったコンポーネントやレイアウトのコードが集まっている「」がすごい
実務でもそのままコピペで使える質
Web制作勉強してる人はこのコードを真似て勉強すると良い
#プログラミング初心者
#駆け出しエンジニアと繋がりたい
#Progate
0
67
775
千葉大がPythonの授業の講義資料を無料公開してるぞ！
テキストをコピペするショートカットから解説してくれてるw
・関数やクラス、制御文などのプログラミング基礎
・Pythonの基礎
・numpy
・scipy
・matplotlib
なども丁寧に解説してあり実践的
1
96
758
これマジでヤバない？
様々な有名サービスのデザインを再現したデータが手に入る「figr」
「ユーザー認証」「ログイン/登録」など、導線ごとにデータも検索できる
データはFigmaのデータとしてコピーすることが可能
PdMの人や個人開発をしてるエンジニアなどめちゃくちゃ重宝しそう
2
67
752
Web制作の勉強してるならこれは絶対やるべき
用意されたデザインに従ってWebページを作り学習する「Frontend Mentor」
用意されてるデザインもかっこいいし、デザインからコーディングするフローも実務に近くかなり勉強になりそう
#駆け出しエンジニアと繋がりたい
#今日の積み上げ
#プログラミング
0
97
741
AIコードアシスタントの「Codium」がやばい
VSCode上から起動して選択したコードの
・内容の説明
・修正の提案
・テストの作成、実行
などを自動でやってくれる
しかもこれで個人利用無料とか神すぎる...
有料プランになるとプルリクの自動生成とか、チームコラボレーションに必要な機能が使える
1
98
741
多くの駆け出しエンジニアがVSCodeを使ってると思うんだけど、StickyScroll機能使ってる？
長い関数やクラス、cssのプロパティを見る際に、その名前を画面上部に固定してくれる
自分がコードのどの部分を読んでるか一目瞭然ですぐ分かるぞ
これはコードリーディング捗る
5
68
728