【世界一分かりやすい】AIを活用した爆速LPコーディング術【Figma for VS Code】

Тәжірибелік нұсқаулар және стиль

◆━━━━━━━━━━━━━━━━━━◆
AI(Figma for VS Code)によって、数百行分のコーディング作業を短縮できるって知っていましたか?これを知っているか知らないかで、出来るコーダーかどうか変わってきます!AIが台頭してきたこの時代の最先端のWeb制作者になるための技術について操作画面つきで分かりやすく解説しました!
---------------------------------------
目次
0:00 OP
0:28 爆速LPコーディングの概要説明
2:04 Figma for VS Codeを立ち上げる
3:19 CSSを作成
4:22 ヘッダー
6:09 ファーストビュー
6:40 お知らせの部分
8:08 導入事例の部分
9:13 ヘッダー
9:29 完成したLPの確認
11:41 ED
---------------------------------------
✅LINE@限定:無料で受けられる!おすすめWebスキル診断はこちら↓
限定ニュースの配信や、転職・フリーランス独立に役立つ情報もお届けしています。
liff.line.me/1654901575-R7n6k...
✅チャンネル登録もよろしくお願いします!
/ @webdesign-daily-trial
✅フリーランスのためのメディアサイト『東京フリーランス』
tokyofreelance.jp/
✅副業/フリーランスに興味があるなら、『デイトラチャンネル』
/ @daily-trial
✅Webデザインにも興味があるなら、『Webデザインチャンネルbyデイトラ』
/ @webdesign-daily-trial
---------------------------------------
~Web制作が気になった人はこのリストの動画からチェック~
• 【Web制作始めるならまずはこれ!】シリーズ
---------------------------------------
~受講生の生の声はこちら~
• 【受講生の体験談】シリーズ
---------------------------------------
◆効果音
Otologic:otologic.jp/
#Web制作
#プログラミング
#未経験
#デイトラ

Пікірлер: 5

  • @user-sc4tc5fh7p
    @user-sc4tc5fh7p5 сағат бұрын

    無料でできる範囲はどこまでなのでしょうか? Figma for VS Codeの拡張機能をダウンロードしてfigmaの下書きを選択すると、連携には開発モードへのアクセスが必要です。みたいな文章がでてきて有料プランへ誘導させて次へ進めません。 無料だと実質的には使えないものなんでしょうか、、、

  • @Alex-og8oe
    @Alex-og8oe13 күн бұрын

    figma for vscodeはcssは出力されますが、HTMLの骨組みについてはfigmaのデザインカンプから出力させることは出来るのでしょうか?

  • @webby-rx2wi

    @webby-rx2wi

    12 күн бұрын

    ご質問ありがとうございます! 今のところ、Figma公式の仕組みとしては、HTMLの骨組みを出力することはできません...。 Figmaのプラグイン「Builder.io - AI-Powered Figma to Code」はHTML構造に変換する機能がありますので、HTMLの骨組みを出力したい場合は、ぜひお試しください!

  • @user-tx2mu2tx6g
    @user-tx2mu2tx6gАй бұрын

    これってタダでできますか?

  • @webby-rx2wi

    @webby-rx2wi

    Ай бұрын

    ご質問ありがとうございます! Figma for VS Codeは無料で使用することができます!

Келесі