【超入門】実践!「iSara」模写コーディングをやってみた② ソースコード配布【HTML・CSS コーディング】
(c) Webの神様 模写ソースコード配布中!↓↓↓ 著作者の方にご快諾いただき、模写ソースコードの配布を開始しました! 下記よりダウンロード(zip …
↓前回の動画はコチラ↓【超入門】実践!「iSara」模写コーディングをやってみた① 【HTML・CSS コーディング】https://youtu.be/OnkZv78HMGY知る人ぞ知る、模写コーディングの登竜門「iSara」の模写コーディング実践シリーズ第2弾です!継続して少しずつ模写コーディングに取り組んでいき、お手本サイトの完成を目指します。是非、皆さんも一緒に挑戦してみてください♪※著作権の関係上、実際のソースコード等の配布はできかねる為、動画内でご確認ください。【iSara】https://isara.life/
【目次】 0:00 イントロ 0:52 前回の振り返り 2:42 ③テキストを抽出する 4:17 ④画像を抽出する 7:08 ⑤HTML編集 11:05 HTMLマークアップの確認 13:18 CSS編集 1:20:05 全ソースコードおさらい 1:21:21 締め
HTMLとCSSの基本学習を終えてから、模写コーディングシリーズをここまでなんとか追っかけて来ました。書籍で学ぶことと模写しながら自分でコードを書くことの壁があまりにも大きかったのですが、なんとか自分で考えながら書いていくことができるようになってきました。
クラス名の付け方も大変参考になりました。<section class=“about”>とか付けていたら、後半ネタが尽きてどうしようもなくなって😭…sec01とかで良いんですね。upperとかlowerというのも勉強になりました。
めちゃめちゃ同時進行で、模写してます!ありがとうございます!すごく勉強になります😆
大変勉強になりました。第三弾も楽しみにしています!
めちゃめちゃ待ってましたーーー!!!続きも本当に待ち遠しいです。よろしくお願いします😂
いつも参考にしています!教えていただきたのですが、稼ぐ力にマーカー風に同じよう線を引くと、文字とかぶらず下に引けてしまいます。文字自体に余白高さがあるような感じで。どうすれば文字とかぶらせられますでしょうか?
いつも動画投稿ありがとうございます。一点相談ですが、フルスクリーンショットへ書き込みをする際に今回使用しているツールを教えていただけないでしょうか。
ただいまコーディング完了です!わかりやすかった😁ありがとうございました✨あとサンタコス可愛い❣️
この部分って教えてくれる動画なかったのでありがたいです。他の動画もポイントを抑えられた動画が多くてありがたいです。
模写終わりました!参考になりました!
初コメです。参考にさせて頂いてます。すいません、調べても出てこなかったので教えて頂きたいのですが、コメントアウトの文字の色の変更はどうされてるのですか?? コメント全体の色を変えるのは見つかったのですが、 <!– –>の部分の黄色に変更するのがどうしても分からなくて… 動画で見やすく感じたので変更したいのです。
macで擬似要素の時に使用するダブルクォーテーションがどうしても全角になってしまいます。色々調べて環境設定から修正するもVScode上飲み全角が治りませんどうすればよろしいでしょうか。。。
早起きして頑張りました!その③も頑張ります!✊
[稼げるエンジニアに必要な5つのスキルとは?]のアイコン下の説明文が1行と2行が混在するときは、アイコンの縦位置を揃えれば良いでしょうか?
待ってました‼️
divとpタグの使い分けはどうしているのでしょうか???文字があるところはp、文字がない複数要素をまとめる時はdivタグですか???
いつもお世話になっています。質問なんですが、使用しているPCはmacの何を使用されていますか?
sec03 ABOUTの装飾で .sec03 ::beforeが、それ以前の.ttl_flame ::beforeの内容も拾う?打ち消す?ようです。結果ABOUTが二つできてしまいます。(.ttl_flame::beforeのcontentは ’ ‘ としています。).ttl_flame ::beforeを.sec03 .ttl_flame ::beforeとして試しましたが、正しいABOUTまで消えてしまいます。position: relative absoluteを複数回使用する際につき調べましたがよくわかりません。分かりづらい説明でごめんなさい。どうしたらよいのでしょうか。
【超入門】HTML・CSSってなに?学習の始め方解説 2021年最新版【未経験・初心者向け】
(c) Webの神様 HTML・CSSの勉強をこれから始める皆さんを全力応援! HTMLやCSSってそもそも何?学習の準備ってどうすればいいの?などの疑問に …
0:00 動画概要説明1:28 HTML/CSSって何?3:00 学習の始め方5:58 HTMLの基本構造13:15 CSSの基本的な構造20:40 終わりの挨拶@ピヨピヨタイム
めっちゃ分かりやすくて良かったです!ありがとうございます😭
今回もとてもよく理解できました!!そろそろCSSの勉強に入りたいと思います^^
今日から真剣に学んでみたいと思います
とっても分かりやすい💕入会金15万払って「未経験からwebデザイナーとしてお仕事できるようになれますよ」って謳ってるスキルスクールに入りましたが、こういう肝心な部分はすっ飛ばされていて絶望しています。本当のズブの素人が最初に必要な知識ってこういうことなんですよね!!!チャンネル登録しました、これから動画一気見します😍
こんにちは☺なつこさんはCSS設計は普段何で書かれていますか(BEMやFLOCSS..etc)
とても参考にさせてもらってます。ゼロからウェブサイトになるまでの動画はありますか?パソコン自体も初心者には難しいですか?
dwを動画教材を使って学習中です。reset.css common.cssでコーディングにつまづいています教材の視聴期限もどんどん進んでいき 課題の締め切りは迫ってくる深く考えすぎなのか全く前に進めなくなってしまいました。この動画であ~そうなんだと感じることがたくさんあります
現役で仕事されてる方は、実務でどう効率よくコーディングされてるか知りたいです。
尊いです!(*´ω`*)
HTML CSSの学習を終えたのでポートフォリオを作りたいのですが、デザインセンスが無いのでどんなページを作ったら良いのかが浮かびません。こんなサイトを参考にするのがおすすめとかあったら教えて下さい。なかなか前に進めません。
ぴよぴよ笑いました🤣次はなつこせんせいの踊りもみたいです!笑 ピロリちゃんねるみたいな感じでよろしくです!にこ
冒頭のピヨピヨ笑いましたw
美味しそう❤️焼き鳥が食べたくなりましたぴよぷよ!
単語を知ってるだけですお恥ずかしい
被り物は何かの罰ゲーム?w
どうした!?なんかの殻をやぶったんかなー。(笑)
かわいい♡からあげくん食べたくなりました(笑)
atomじゃないんかい
かわいい
【Webデザイナー・プログラマー】初心者必見!挫折しないためのプログラミング勉強法 【独学・学習効率アップ】
(c) Webの神様 これから勉強を始めようとしている、もしくは勉強をしていて今にも挫折しそうになっている方に、絶対に観ていただきたい内容です!
これから勉強を始めようとしている、もしくは勉強をしていて今にも挫折しそうになっている方に、絶対に観ていただきたい内容です!HTML・CSSや、プログラミング言語の学習を挫折しない為のポイントを紹介しています。【GeekSalon】https://geek-salon.com/動画内で紹介している、学生限定のプログラミングスクールです。※GeekSalonさんのご紹介にあたって、謝礼などは頂いておりません。今回、当チャンネルを紹介したいとのご好意でご連絡をいただき、非常に良いサービスだと感じましたので、本動画で紹介させていただきました。▼▼▼動画内で紹介している過去動画はこちら▼▼▼【超入門】初心者向け 模写コーディング!オススメのやり方とポイント【HTML・CSS コーディング】https://youtu.be/OH1X09Ilu9E【超入門】初心者向け!ドットインストール無料版&有料版のおすすめ講座と活用法【HTML・CSS コーディング】https://youtu.be/b3t3T0rHQbU
自分は一度プログラミング学習で色々調べてpaizaを使い挫折して、それでもやっぱり諦められずまた勉強したいと思い、なつこさんの動画に出会えてよかったと思います(^^)初心者で挫折してまた始めて自分なりの学習方法を少しわかってきた感じがします!はじめから難しいところで勉強していくとダメなんだなと思いましたね(^^;それとですね。。よけいかもしれませんが、ゴマすりみたいな手の持ち方?というんでしょうか。ちょっと気になりますね。。やめられないなら仕方ありませんが変えた方がいい気が。。
関連動画でたどり着いたけどすごいいいチャンネル絶対もっと伸びると思うこのチャンネル説明が的確だしわかりやすいしもっと動画出して欲しいなんか頭がいいんだろうなものの捉え方とかが正確な気がする
いつも楽しく拝見しております。現在プロゲートを利用しておりますが、ドットインストールも必要かな、書籍も必要かなと思っていたら、教材の数ばかり増えてしまい、勉強に集中することができなくなりました。このような場合に教材を絞るのはどのような基準がよろしいでしょうか?よろしくお願いいたします。
クラウドソーシングで仕事が出来る様になりたいと思いプログラミング学習を始めて半年経過しました。なかなか収益化出来るほど実力が付かず、オンラインスクールを利用することにしました。ですが、やっぱりオンラインは一人ぼっちな感じがしてやる気が低下気味でした。Twitter見ていてもやる気に溢れてる人たちが沢山いて圧倒されて凹んでしまう、みたいな感じです。なつこさんのプログラミング学習者へ寄り添って下さる動画にいつも励まされています。もう少し頑張りたいと思います!リクエストですが、プログラミングで仕事をするとなるとやはりフォトショップやイラレが必須のような気がするのですが、よい勉強法があればご紹介いただきたいです!
いつも楽しく勉強させて頂いています。一つお聞きしたいのですが、作業中に流れているBGMは何という曲なんでしょうか?耳から離れなくなり、作業中のBGMにしたいと思っております。宜しくお願いします🙏
HTMLとCSSのおすすめの書籍を教えてください📚
ナツコサイコー!
プロゲートサイコー!
サムネ、超絶かわいいです❤️✨❗️
プログラミングスクールのリンクがエラー出ます。。。
先生!オヤツは1500円まで認めてもらえますか?カツカレーをオヤツに持って行きたいんです。勉強しながらカツカレー食べて、昼寝するのが幸せです。
【超入門】初心者向け!ドットインストール無料版&有料版のおすすめ講座と活用法【HTML・CSS コーディング】
(c) Webの神様 プログラミング学習の登竜門!ドットインストールを最大限に活用するポイントと、無料版有料版それぞれのおすすめ講座についてまとめまし …
始めようとする人たちの多くが欲しい情報を丁寧に、そして、心を込めて提供してくれてありがとうございます。「ドットインストールだけで完結するようなことはなく3分動画に対して2時間くらい調べ学習が必要になったり、並行して書籍を読み進めることが必須」ということだけでも知っているのと知っていないのでは習得の仕方が大きくことなるので、本当に助かります。
ドットインストール有料版で学習していたのですが、当たり前のように知らない用語がたくさん出てきて、何度も見直してただ、模写してVS Codeの補助使って出来てる気になってました。ただ、それ以外どう勉強すればいいかも分からなくて、困ってました。動画見てよかったです!学習方法見直してみます。ありがとうございます!
新作動画、心待ちにしていました!めっちゃ嬉しいです♪ 毎週、毎週、新作動画がリリースされないかなと気になり過ぎて仕事が捗りません(T . T)
初心者にはかなり参考になります。ありがとう!
ドットインストールについてとても分かりやすいです。ドットインストールを活用します。ありがとうございます😊
webの学習はじめたばかりです!ドットインストールはじめてききました!みてみます!おすすめの書籍もあれば教えてほしいです。
プロゲートについて動画にしていただけると嬉しいです!
最近ドットインストール有料会員になり毎日勉強してますが、応用がなかなか難しく混乱しています。仕事にしたいのでしっかり学びたいのですが、なつこさんがおすすめするHTMLとCSSあとJavaScriptの書籍で簡潔で分かりやすい使い方が載っているものがあったら教えてください。HTMLとCSS本は持っていますが、上辺のことしか書いていなく、文章ばかりであまり用語が載っていなくて使わなくなりました。
自分もう7年前からやらなくなったのでまた新たに勉強し直したいと思いますが、おすすめの書籍かサイトありますか?
他の方もコメントされてますが、プロゲートについての動画はでますでしょうか?
応用が苦手なので自分が知識を使いこなせるか不安です。私は書籍だと頭に入らず読んでいても忘れてしまうので動画で学習しています。書籍で補えない場合はYouTubeや動画、スペルを書いて学習すれば大丈夫でしょうか。仕事にしたいので心配です。
まこなり社長のとこから来ました。いくつか動画見てみます。
こんにちは☀かわいい💕
【超入門】初心者向けJavaScript解説!これから学習を始める方必見【Webデザイン・プログラミング】
(c) Webの神様 いま、学んでおいて損はないおすすめのプログラミング言語、JavaScriptの初心者向け解説です! これから学習を始める方にも気軽に観て …
いま、学んでおいて損はないおすすめのプログラミング言語、JavaScriptの初心者向け解説です!これから学習を始める方にも気軽に観ていただけます。↓↓↓ jQuery解説はこちら ↓↓↓【超初心者向け】jQuery最新版の読み込み・使い方解説2021!初めてでも簡単にアコーディオンメニューが作れるようになります【HTML・CSS コーディング】https://youtu.be/Vw7xzB78uGg【初心者向け】jQueryで作るハンバーガーメニュー3種類!スライドメニュー、フェードインなど レスポンシブデザイン【HTML・CSS コーディング】https://youtu.be/8BItmm-CQvc
動画めちゃくちゃわかりやすかったです!ドットインストールでHTML,CSS一通り終えて、Java Scriptの学習を始めているのですが、HTML,CSSで、模写コードを見ないでも出来る位に、HTML,CSSかけるようになってから、次の学習は始めた方が、後の理解が早かったりしますか?
丁度始めようと思っていたのですごく嬉しいです!頑張って勉強します!
動画アップまってました!👏とてもわかりやすいコンテンツばかりで助かってます〜
Webデザイナー向けのJavaScriptの解説動画や本があまりないので、実用的な(スライドショーや固定ヘッダーなど)コードの書き方を教えていただけると嬉しいです。
はじめまして!ひよこなつさんかわいいですね(*´∀`)説明が分かりやすいのでいつも参考にさせてもらってます。私は今JavaScriptの勉強しているのですが苦戦してます。JavaScriptで何か作る動画をリクエストしたいです!カルーセルとかお願いします!
初めて動画、拝見しました。丁寧に説明されてて分かりやすかったです。ジャバスクリプトを身近に感じました。ウレピヨです☺笑。ありがとう。
ほんとに説明がわかりやすいから自分もJavaScriptできるんじゃね?て思えましたwww
いつも、視聴を楽しみにしています。こんな動画があるんですね。ありがとうございます。
JSをbodyの閉じタグの下で読み込むみたいなのも聞いたことあるのですが間違ってますか?
丁度、最近勉強し始めました。前から勉強させて頂いてます。キャラ変可愛いですね(笑)
JavaScript美味しそうで、楽しそうですね! 楽ピヨです!
どうしたら、consoleの画面が表示されるのですか?
JavaScriptとjavaはメロンとメロンパンくらい違う!
完了です
一年前からファンです!
うれピヨです!かわいいw
なっちゃんの下着何色?
コメント