レスポンシブウェブサイトポートフォリオ(App Official Landing Website)

レスポンシブウェブサイト・ポートフォリオ(App Official Landing)制作過程は、HTML+CSS+JQUERYパブリッシングによるレスポンシブウェブサイト制作の全工程を通じて、パブリッシング中級レベルへと進むための基礎を固め、実戦パブリッシングのノウハウを習得します。特に、ウェブサイト制作の全工程を十分な解説と実戦作業で経験することで、個人ポートフォリオサイト制作への自信がつきます。必須で使用すべきjQueryプラグインとして、Scroll Reveal AnimationとSlickスライダーの使用法を学習します。レスポンシブ制作の手法は、従来方式のfloatとpositionを利用したレスポンシブレイアウト制作方式で制作します。ただし、特定の要素においてはFlexを使用する部分もあります。

難易度 初級

受講期間 無制限

HTML/CSS
HTML/CSS
jQuery
jQuery
Responsive Web
Responsive Web
HTML/CSS
HTML/CSS
jQuery
jQuery
Responsive Web
Responsive Web

学習した受講者のレビュー

5.0

5.0

서병식

76% 受講後に作成

コーディングワークスの講義中、本番サイト制作パートを3回目に学習しました。 このレクチャーの前にフレックスサイトの制作レクチャーを聞いたので、floatは使用せず、一度フレックスでレイアウトをキャッチしました。 時間的な余裕があってロゴも別々に作ってデザインもそれなりに若干変更して取ってみました。 スリックスライダーの概念を今回もう少し確実につかむようになりました。 jsパートでも概念整理を少しもっと熟したようです。 アニメーションが多く、今回その部分が特に印象深かったし、FAQパートでアコーディオンの作り方、inputとlabelをつなげてタップメニューの作り方なども私には多くのお役に立ちました。 少し残念なのは、私が3840解像度のモニターで作業していると思います。 メイン画面で縦を90vhにしたとき、次の段落であるceo accessと間隔があまりにも広がることになるという点。 また、flexで作業をしたとき、左右のアニメーションになると横スクロールが発生し、画面が壊れ、画面上部にfixedされたheaderが上下に隠れてしまうことが起こりました。 最初はスクロールが起こる原因を知らず、一日中ソースを見ながら頭を握った。 後で見るとそんな理由だったようです。 だからflexになっていた部分の中にアニメーション関連するところはすべてfloatに修正したところ異常はありません。 とにかく情熱あふれる講義はとても感謝しています。 常に健勝を祈ります。 ありがとうございます!

5.0

이슬비

100% 受講後に作成

最後まで充実した講義をよく聞かせていただきました。 初級以上の実力になりたい方は必ず受講すべきほどカリキュラムがよくできています。 中級者が聞いても充実した講義だったと思いますね。講義がそれほど聞く価値があります。 入門者、初級者なら核心理論講義は必ず聞くべきです。不足している部分を補ってくれる感じでした。 後に出てくるレスポンシブランディングページを簡単についていくためには、なおさら聞くべきだと思います。 ランディングページをする時も説明してくださいますが、それでも聞いてから進めればより簡単に理解できます。 聞く人の違いはあるでしょうが、私が聞くにはちょうど良い講義だったと思います。 説明をよくしてくださって理解もよくできましたし、実戦にも必要な講義でした。 とても役に立ちました。良い講義をありがとうございます。

5.0

a토링

75% 受講後に作成

講義受講前にはホームページ一つ作らなければならない!とコーディングをすると、ぜひ私の頭のように構造が出てこないピビトゥル抜きしてマージンに-230pxを与えたがどこにいてもまたほぼハンガジにはめ合わせながら構造を作りました。そして、それから&quot;あ〜私はフロントランが凧ではないかと思います〜の繰り返し........ 映像を見ると全体的な絵もよく描かれて、講師様が無限繰り返しを話してくれるはずだから、聞いてみると先生があんなに何を話すんだってことも分かるほどになると思います。 たとえば、講師は&quot;子要素にfloatを与えます。&quot;というコメントをすると、そのあとには無条件に付いてくるのが&quot;子要素にfloat値を与えたから親要素が高さ値を失ってしまうので、親にoverflow:hiddenを与える"というのがほぼ毎~~~~~~~~~ 。このように別に覚えようとしなくても、フロートにプルだけ出ても親オーバーフローヒドンがこのマシンのように覚えるほど繰り返しをしてくれるので、構造がぴったり頭に入るようになります。 講義の紹介によれば、学習方法でセクション3(ヘッダー~モバイル)作業を楽に見てほしいのですが、私も以前の講義ではそうではなく、ただ結果物が出ればそれに満足をしました。ころ講師様のように作った結果物を見て、私が作ったものと勘違いをするようになったんですよ…。と言えば…。だから今回はただ心を空けて初めてはベッドに横になっても見て、みかんを食べながらも見て、洗濯しても見て、バスでも見てww pcの前に座って見た時も世の中快適な姿勢で見たんですが..(..ㅎこれがまさにオンラインのメリットじゃないですか) 聞いてみると無条件に本人がよく分からない内容が出てきました。そんなことはまた聞くともちろん気にしないかもしれませんが、一度学ぶときに軽く~~にメモ帳を1つ入れてor(pcで聞くなら)インフラの右側に手書きするのに簡単なメモを添えて聞くとあまり眠くない(<s>睡眠の奴隷&lt; / s&gt;)手が遊んでいますないから覚えが良くなったんですよ。そして、&#x27;講義今日みんなでした〜&#x27;すると終わりで今日学んだ内容の中で私が本当に知らなかった内容がメモ帳に整理が次々となるので、軽くスッと見ながら理解し、復習する時も楽です。 そして、2回毒をする時は直接コーディングを入力しながら見る時はあえて講師様と同じ速度で作るよりも、まず完成本写真+基本構造を見て先に作ってみて、cssたっぷり入れてから、どのように講師様と違って入れたかを比較しながら見るのも楽しいと思います。そうすれば完全に私なのか、私が打者練習だけしたのかよく分かると思います。また、こうすれば質問も質の良い質問が来ることができると思います。 2回毒を終えれば、複数のサイトを見ながらf12を押さずに自分で作ってみるのもいいと思います。ところが2回毒を終えれば(イ・ジョンガンの含む) どんなサイトたちは構造が目に入って氷のようにまねる私の姿を見るようになりましたね! 故に、時間に追われて一回毒に終わるよ!と思うよりも、1回毒は本当に世界で一番楽な姿勢で見て、2回毒で直接コード入力する時は、どんどん残る記憶と思います。とにかく私のような愚か者もある程度追いつく講義とは、他の誰も挑戦する価値のある講義だと思います。 p.s) いや、ところが、この川の初級対象となっているのに、これ初級映像なのでしょうか..?......

受講後に得られること

  • ウェブサイトパブリッシング全体のスキルとノウハウの向上

  • 従来の方式であるfloatとpositionを利用して99%配置したレスポンシブレイアウト

  • position属性の正確な概念と活用

  • hover before after checked active 擬似クラスの理解と活用

  • ジェイクエリ(jQuery)核心理論の学習および応用

  • CSSタブメニューコンテンツ、JQUERYアコーディオンメニューコンテンツの制作能力

  • CSS3 filter 属性、object-fit 属性の活用

  • モバイル対応レスポンシブウェブパブリッシング制作能力(メディアクエリ)

  • PC版とモバイル版で最適化されたレスポンシブウェブの全体制作能力

  • Scroll Reveal Animation プラグイン

  • テキストタイピングアニメーションプラグイン

  • Slickスライダーの使い方およびカスタムCSSの修正方法

レスポンシブウェブサイトポートフォリオ
(App Official Landing) 制作過程

'計22時間以上のレスポンシブウェブサイトポートフォリオ講義'
'核心理論の授業とレスポンシブウェブサイト制作過程'
'パブリッシャー就職のためのレスポンシブポートフォリオホームページ制作コース'
'実務パブリッシングの真の実力のためのハードコーディング授業'
'9時間以上の必須jQueryプラグインの使用方法およびCSS必須核心理論動画'
'現職パブリッシャー兼パブリッシング専門講師の丁寧で体系的な授業'

 


📔 レスポンシブウェブサイトのポートフォリオ制作過程の特徴

01) 純粋なCSSレイアウト配置方式で作るレスポンシブウェブサイト

02) クローンサイトやコピーサイトではなく、CodingWorksが直接UIデザインからパブリッシングまで制作したウェブサイト

03) 講義セクション別14段階のステップ別完成版とUIデザインPSDファイルを提供
※ フォトショップUIデザインはPhotoshop CC 2019バージョンで制作されました。

04) 合計22時間以上の制作講義

05) 理論学習と制作のためのテキストエディタ
今回のレスポンシブウェブサイト制作講座で使用されたテキストエディタは、Visual Studio CodeBracketsです。もちろん、他のテキストエディタを使用しても問題ありません。受講生の方が使い慣れたテキストエディタを使用してください。ただし、リアルタイムプレビュー機能がないテキストエディタは、学習を進めるのが大変かもしれません。

06) スムーズな制作過程の学習に不可欠な核心理論動画(Slick Slider, Reveal Animation)
レスポンシブウェブサイトのポートフォリオ(App Official Landing Website)制作講義を除き、jQueryプラグインの使用方法や制作に不可欠なCSS理論など、9時間以上の核心理論講義動画があります。これらの動画を見ずに実践制作セクションに進むと、ついていくのが大変かもしれません。[セクション 2. 必須jQueryプラグインの使用方法およびCSS必須核心理論]で、聞き慣れなかったり不足していると思われる内容を十分に学習してから進んでください。


💡 PCレイアウト セクション切り替え プレビュー(Preview)

💡 Mobile レイアウト UI/UX プレビュー(Preview)


🙋🏻‍♂️ 講義受講のための事前知識

今回のレスポンシブウェブサイト制作の難易度は、入門または初級の方には難しいです。受講レベルは中級、あるいはそれに近いレベルであれば、スムーズに付いてくることができます。少なくとも自分は初級ではないと思っている方であれば、進める上で大きな困難はないと考えています。

受講のための事前知識としては、HTML+CSSに関する基本的な内容を理解していれば大丈夫です。だからといって、HTML+CSSを完璧に使いこなせる状態である必要はありません。20時間を超える講義の中で、余裕を持って十分に説明しています。もし動画を見ながら受講生の方のコーディングが追いつかず、HTML+CSSの作成が遅れてしまう場合は、動画を止めてHTML+CSSの作成を終えてから、次のステップに進んでいただければと思います。

動画を止めてコーディングをしたりするため、他の人より少し時間が必要なだけです。むしろ、落ち着いて自分でコーディングする時間を持つという面では、その方が良いです。あまり心配せずに、一緒に勉強していきましょう。 ^^

私の講義の中に'HTML+CSS+JQUERY ポートフォリオ中級実戦パブリッシング講義'があります。この講義にある理論内容と実戦例題の制作内容に、今回のレスポンシブウェブサイト制作に必要な内容がほぼすべて含まれています。つまり、HTML+CSS+JQUERYの基礎を確実に固めることができる講義だと思います。

今回のレスポンシブウェブサイト制作において、いくつかを除いては'HTML+CSS+JQUERYポートフォリオ中級実戦パブリッシング講義'の内容を1回程度学習してから進めていただければ、よりスムーズに理解できると思います。

結論は…

入門や初級でなければついてくるのは問題ありませんが、少し大変だと感じられるかもしれません。
他の講義を通じてHTML+CSSの基本を身につけてこられたのであれば、十分についてこられるだけでなく、なぜこのようにするのかという理解を持ってレスポンシブウェブサイトの制作過程を終えることができると思います。


📕 効率的な学習のためのコーディングワークスの学習方法の提案

学習方法は人それぞれ異なると思います。そのため、正解はありません。しかし、経験者であり制作者が考える効率的な学習方法は存在すると考えています。そこで、コーディングワークスが考える効率的な学習方法を提案します。

[ステップ1]
セクション3からセクション16まで、全体の制作過程を実習なしで映像を最初から最後まで見ます。 (12時間を超える制作過程なので、ただ見るだけでも簡単ではありません。ですので、移動中や食事中などに気軽に見てください。ただ何を作るのか、どのような順序で作るのか程度を注目して見れば大丈夫です。)

[ステップ2]
ステップ1を行うと、どの部分に理論が必要か、どの部分に準備が必要かが自然と分かるようになります。そうすれば、そのような部分を完璧にではなくても、制作に必要な理論事項をある程度学習します。基礎レベルの方でなければ、セクション2「必須jQueryプラグインの使い方およびCSS必須核心理論」に動画を用意してありますので、不足することはないと思います。ただし、擬似クラス、セレクタなどHTML+CSSの必須の理論事項は、CodingWorksのYouTubeチャンネルで勉強してください。

[ステップ3]
セクション3から動画をじっくり見ながら実習を進めてください。 事前準備が十分に整っているので、ついてくるのがずっと楽になると思います。

[ステップ4]
映像と一緒にレスポンシブウェブサイト全体の制作を終えたら、提供されたフォトショップPSDファイルを開き、UIデザインを自分なりのテーマを決めて修正してください。レイアウトに大きな変更は加えず、既存のレイアウトを部分的に修正して個人ポートフォリオのUIデザインを完成させてください。

[ステップ5]
制作したUIデザインを基に、PPTで機能定義書とHTML構造を作成し、実践パブリッシングを進めて完成させてください。これで、あなただけのデザインポートフォリオとパブリッシングポートフォリオが完成します。


🙋🏻‍♂️ 講義に関する予想される質問必読事項

Q. 制作例を進める中で出てくる中級CSS理論の解説動画はありますか?
A. 「制作例を作っていますが、基礎理論に出てこなかった中級理論がたくさん出てきます。中級理論のレッスンはどこで受けられますか?」という質問が掲示板によく寄せられます。

現在のコースは、初級パブリッシングの例題制作を行うコースではありません。初級〜中級のパブリッシング例題を制作するコースです。そのため、CSSの初中級理論はある程度理解している必要があります。といっても、必ずしも完璧に理解している必要はありません。CSSの初中級理論は、例題を制作しながら継続的に繰り返します。また、CodingWorksのYouTubeパブリッシングチャンネルに「[中級理論] CSS中級理論」という再生リストがあり、例題制作に必要な必須の中級理論動画が詳しく用意されていますので、現在のコースを受講しながら中級理論を並行して学習することをお勧めします。

▲ コーディングワークス YouTube チャンネルはこちら

Q. この講座を受講すれば、実務でパブリッシャーとして働けますか?
A. この講座にあるパブリッシングの内容をすべて理解し、うまく活用できるのであれば可能です。しかし、パブリッシングというのは十分な経験と、多様な種類のウェブサイトを制作した経験があってこそ実務で働くことができます。本講座のような講義をあと数個学習し、ウェブサイト制作の全工程をいくつか経験すれば大丈夫だと思います。もちろん、個人のポートフォリオサイトの制作も必要です。パブリッシングの参入障壁は思ったより高い方です。動画を一度見ただけで、その内容やノウハウがすべて身につくわけではないので、前述した学習方法を通じて自分のものにするプロセスを大切にしてください。

Q. ウェブサイトを制作しながら出てくる理論を説明する理論パートが別にないようですが?
A. 今受講されているコースは入門、初級コースではなく、中級レベルのレスポンシブウェブサイト全体の制作パブリッシング講義です。基本理論パートと実践例題制作の学習は、他のコースを通じてスキルアップされることをお勧めします。

Q. 学習中に分からないことがあったら、どこに質問すればいいですか?
A. 質問がある場合は、[質問&回答] 掲示板に投稿していただければ、確認次第(すぐには難しい場合もありますが)回答いたします。また、質問はできるだけ具体的に作成してください。質問が具体的でない場合、十分な回答を差し上げることが難しくなります。そのため、質問される際は、気になる内容とともに、作成中のHTML、CSS、JQUERYのコーディング画面をキャプチャして添付していただければ、よりスムーズに回答できます。

Q. 講師の授業の中で <パブリッシャー就職 ガチ実践ガイド>を先に見たほうがいいでしょうか?
A. パブリッシングスキルをさらに習得することも重要ですが、まずはパブリッシャーとしての基本を身につけることが優先されるべきです。パブリッシャー就職実践ガイド電子書籍(PDF)では、パブリッシングの基本とは望ましいコーディング習慣と原則、経験者のようにパブリッシングする方法など、パブリッシャーとして必ず知っておくべき内容を細かく整理しました。パブリッシャー就職実践ガイド電子書籍(PDF)を先に読み、パブリッシングの基本に対する理解を十分に深めてから学習されることをお勧めします。下の画像をクリックすると、授業の紹介内容をご覧いただけます。


▲ パブリッシャー就職のためのコーディングワークス・パブリッシング講義ロードマップ

 

❤ コーディングワークスの受講生から届いたパブリッシャー合格の知らせ


▲ 国費支援パブリッシング課程で私から4ヶ月半ほど学んだ学生ですが、就職したとカトク(LINE)が届きました。


▲ コーディングワークスの個人ポートフォリオ制作オフライン講座の受講生から、面接・就職結果のLINEをいただきました。(2023.4.24)

 


❤ コーディングワークスの受講生がパブリッシャーとして就職後に送ってくださったメール

 

先生、こんにちは :)

先生のInflearnの講義を受けていた学生の金O正です。
今年の夏、個人ポートフォリオについてアドバイスをいただこうとメールを差し上げた学生です。
覚えていらっしゃいますでしょうか?(笑)

ほかでもありませんが、
先生にアドバイスをいただいたポートフォリオで、パブリッシャーとして就職に成功したという報告をしたくてメールを送りました!

しかも!!
求人サイト(サラムイン)に載せていたポートフォリオを見て会社側から先に連絡があり、Zoomで面接を受けて合格しました!
会社側では希望年収を考慮してくれましたし、デザインや開発業務を行わない、本当にパブリッシャー!としての業務だけに専念できる会社に入ることになりました。

経験者パブリッシャーを募集している会社でしたが、新人である私に連絡が来たので、なぜ私に連絡をくださったのかと尋ねたところ、
他の人たちのポートフォリオもたくさん見たけれど、私のポートフォリオにあった「機能定義書」が目に留まって連絡したとのことでした。

これらすべては先生の講義のおかげだと思っています。
先生の講義を聞いていなければ、私もやはり平凡なポートフォリオになっていたはずですが、先生が教えてくださったコツのおかげで就職に成功することができました!

直接お会いしたことはありませんが、
ポートフォリオを作成している間、先生の講義を見ながらとても励まされ、信頼して一生懸命作りました!

塾で長い時間授業を聞きながら積み上げた実力よりも、先生の講義を聞いてポートフォリオを作った3ヶ月間のほうが、実力が格段に上がったと実感しています。

切実に願い、
先生がおっしゃった通りに信じて取り組んだところ、本当に良い結果が出ました。

本当にありがとうございました!

コロナにお気をつけて。
また良い講義でお会いしたいです :)


先生、こんにちは〜。Inflearn受講生のOOOです〜。メールアドレスは他の受講生への回答を見て知りました(笑)

感謝の気持ちをお伝えしたくて。ww

これまで先生の講義を受講し、2週間ほど履歴書を出しながら苦労もしましたが…
ある会社から面接合格をいただき、出勤することになりました。本当にありがとうございます…(涙)

実は私が32歳ということもあり、不安が多かったです。履歴書をたくさん送ったのですが、なかなか連絡も来ず……
ですが、この会社の採用担当者の方は、自分はスクール出身者はあまり好きではないとおっしゃっていました(笑)
私が入社することになった会社は規模は小さいですが、開発者もいてウェブデザイナーもいます。
3ヶ月間教育を受けてから実務に投入されるという形式でした。
距離も少しあり、年収も低い方ではありますが……一生懸命学んで年収を上げていこうと思います〜(笑)

これまで本当にありがとうございました。質問にも丁寧に答えてくださり、こうしてオンラインで講義を受けて就職が決まったので、とても不思議な気持ちです。

これからも先生の講義を聞きながら、さらに実力を高めて勉強していきます。ファイト〜!

 

🙋🏻‍♂️ 質問する前に必ず!読んでください〜!!

学習中に気になることがあれば、質問してください。質問される際は、うまくいかない内容とコード、そしてブラウザの結果画面のキャプチャをアップロードしていただく必要があります。コードについては、HTML、CSS、JSのコードをすべて載せていただければ、正確な回答を差し上げることができます。

質問文にコードがなく文章だけで問題を説明されると、非常に簡単な内容でない限り、正確な回答を差し上げることが難しくなります。そうなると、私が「HTML、CSS、JSのコードとブラウザのキャプチャをアップロードしてください〜」と再度返信せざるを得なくなり、結局解決策を得るまでに手間と時間が余計にかかってしまいます。


▲ 該当講義コミュニティの「よくある質問」をまず確認してください〜

 


⚡ 効果的な学習のために、ぜひ!コーディングワークス・パブリッシングのYouTubeを参考にしてください。

コーディングワークス・パブリッシングのYouTubeチャンネルで、理論の動画講義を並行して視聴することをお勧めします。もちろん、すべての理論動画がYouTubeチャンネルにあるわけではありませんが、重要な理論動画はほとんど揃っています。動画の数が多いので、動画を探す際は以下の例のように検索するのが良いでしょう。

コーディングワークス パブリッシング YouTubeチャンネル: https://www.youtube.com/codingworks

 

👨🏼‍🏫 講師紹介

  • (現在)フリーランス フロントエンドパブリッシャー
  • ザ・ジョウンコンピュータアカデミー ウェブパブリッシング講師
  • イゼンコンピューターアカデミー ウェブパブリッシング講師
  • フロントエンドパブリッシャー、フロントエンドパブリッシング専門講師
  • イゼンコンピューターアカデミー ウェブデザイン技能士 実技資格対策クラス
  • ラクピアICTトレーニングセンター フロントエンドパブリッシングマスターコース講師
  • イジエンエデュフロントエンドパブリッシング、UI/UXデザイン
  • HTML+CSS+JQUERY パブリッシング YouTube チャンネル 'コーディングワークス' 運営
  • コーディングワークス パブリッシング YouTube チャンネル - https://www.youtube.com/codingworks

面接と就職を勝ち取るパブリッシャー個人ポートフォリオホームページ制作、scss、sass、flex、grid、html、css、html/css、website、ウェブパブリッシャー、パブリッシャー就職、ウェブサイト、コーディング、coding、jquery、javascript、ジェイクエリ、JavaScript、レイアウト、インタラクティブウェブ、interactive web、web design、ウェブデザイン、ポートフォリオ、パブリッシング、レスポンシブウェブ、ウェブデザイン技能士実技試験、bootstrap、ブートストラップ、css frameworks、フレームワーク

こんな方に
おすすめです

学習対象は
誰でしょう?

  • ウェブサイト制作の全工程を経験したいパブリッシャー

  • パブリッシングの基礎を活かした実践的なウェブサイト制作を希望する方

  • パブリッシングの個人ポートフォリオサイト制作が必要な方

前提知識、
必要でしょうか?

  • HTML+CSSの基礎コーディング能力

こんにちは
codingworksです。

13,086

受講生

787

受講レビュー

2,122

回答

4.9

講座評価

23

講座

■ [現在] 国費パブリッシング&フロントエンド講師
■ [現在] フリーランス フロントエンドパブリッシャー
■ [現在] HTML+CSS+JQUERY パブリッシング YouTubeチャンネル「コーディングワークス」運営
■ グリーンコンピュータアカデミー ウェブパブリッシング講師
■ ザ・ジョウンコンピュータアカデミー ウェブパブリッシング講師
■ イゼンコンピュータアカデミー ウェブパブリッシング講師
■ フロントエンドパブリッシャー、フロントエンドパブリッシング専門講師
■ UI/UX ウェブデザインポートフォリオ講義
■ ウェブデザイン技能士実技資格クラス講義
■ イージー&エデュ フロントエンド UI/UX デザインおよびパブリッシング

 

🌏コーディングワークス Inflearn 講義一覧 - https://www.inflearn.com/users/@codingworks
🌏Inflearn コーディングワークス 講義学習順序(学習ロードマップ) - https://www.inflearn.com/blogs/2351
🌏コーディングワークス Inflearn パブリッシングブログ - https://www.inflearn.com/users/@codingworks/blogs
🌏コーディングワークス パブリッシング YouTube チャンネル - https://www.youtube.com/codingworks
🟣Inflearn In-focus コーディングワークス インタビューを見る : https://www.inflearn.com/pages/infocus-8-20230704

もっと見る

カリキュラム

全体

108件 ∙ (23時間 47分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

32件

5.0

32件の受講レビュー

  • mmm3n50119님의 프로필 이미지
    mmm3n50119

    受講レビュー 6

    平均評価 5.0

    5

    44% 受講後に作成

    音も抱きしめて会社で、、、、とてもおおまかな流れだけpcバージョンまで見ました 本当に流れだけ知っている... 今、講義ちゃんと見ながら従って、見ていない、どれだけ変わっているのか気になりますね。後で一番下に修正します。

    • codingworks
      知識共有者

      lololoさん久しぶりですね。現職デザイナーですね。退勤して大変だから週末にじっくり一段階一段階映像見ながらフォローしてみて~

  • suhbyungsik1535님의 프로필 이미지
    suhbyungsik1535

    受講レビュー 3

    平均評価 5.0

    5

    76% 受講後に作成

    コーディングワークスの講義中、本番サイト制作パートを3回目に学習しました。 このレクチャーの前にフレックスサイトの制作レクチャーを聞いたので、floatは使用せず、一度フレックスでレイアウトをキャッチしました。 時間的な余裕があってロゴも別々に作ってデザインもそれなりに若干変更して取ってみました。 スリックスライダーの概念を今回もう少し確実につかむようになりました。 jsパートでも概念整理を少しもっと熟したようです。 アニメーションが多く、今回その部分が特に印象深かったし、FAQパートでアコーディオンの作り方、inputとlabelをつなげてタップメニューの作り方なども私には多くのお役に立ちました。 少し残念なのは、私が3840解像度のモニターで作業していると思います。 メイン画面で縦を90vhにしたとき、次の段落であるceo accessと間隔があまりにも広がることになるという点。 また、flexで作業をしたとき、左右のアニメーションになると横スクロールが発生し、画面が壊れ、画面上部にfixedされたheaderが上下に隠れてしまうことが起こりました。 最初はスクロールが起こる原因を知らず、一日中ソースを見ながら頭を握った。 後で見るとそんな理由だったようです。 だからflexになっていた部分の中にアニメーション関連するところはすべてfloatに修正したところ異常はありません。 とにかく情熱あふれる講義はとても感謝しています。 常に健勝を祈ります。 ありがとうございます!

    • codingworks
      知識共有者

      受講評ありがとうございます〜!

  • hkgb0009님의 프로필 이미지
    hkgb0009

    受講レビュー 1

    平均評価 5.0

    5

    90% 受講後に作成

    頑強成功しました。もともと基礎知識もあって5日で頑張ってしまいますね。

    • codingworks
      知識共有者

      スンフンはすでに頑張っていましたか?講義が上がってから一週間しかできませんでしたが、熱心に頑張りましたね。今回作業したことを変更して、個人のポートフォリオにしたらいいと思います。 受講後ありがとうございます〜^^

  • taes11014397님의 프로필 이미지
    taes11014397

    受講レビュー 5

    平均評価 5.0

    5

    75% 受講後に作成

    講義受講前にはホームページ一つ作らなければならない!とコーディングをすると、ぜひ私の頭のように構造が出てこないピビトゥル抜きしてマージンに-230pxを与えたがどこにいてもまたほぼハンガジにはめ合わせながら構造を作りました。そして、それから&quot;あ〜私はフロントランが凧ではないかと思います〜の繰り返し........ 映像を見ると全体的な絵もよく描かれて、講師様が無限繰り返しを話してくれるはずだから、聞いてみると先生があんなに何を話すんだってことも分かるほどになると思います。 たとえば、講師は&quot;子要素にfloatを与えます。&quot;というコメントをすると、そのあとには無条件に付いてくるのが&quot;子要素にfloat値を与えたから親要素が高さ値を失ってしまうので、親にoverflow:hiddenを与える"というのがほぼ毎~~~~~~~~~ 。このように別に覚えようとしなくても、フロートにプルだけ出ても親オーバーフローヒドンがこのマシンのように覚えるほど繰り返しをしてくれるので、構造がぴったり頭に入るようになります。 講義の紹介によれば、学習方法でセクション3(ヘッダー~モバイル)作業を楽に見てほしいのですが、私も以前の講義ではそうではなく、ただ結果物が出ればそれに満足をしました。ころ講師様のように作った結果物を見て、私が作ったものと勘違いをするようになったんですよ…。と言えば…。だから今回はただ心を空けて初めてはベッドに横になっても見て、みかんを食べながらも見て、洗濯しても見て、バスでも見てww pcの前に座って見た時も世の中快適な姿勢で見たんですが..(..ㅎこれがまさにオンラインのメリットじゃないですか) 聞いてみると無条件に本人がよく分からない内容が出てきました。そんなことはまた聞くともちろん気にしないかもしれませんが、一度学ぶときに軽く~~にメモ帳を1つ入れてor(pcで聞くなら)インフラの右側に手書きするのに簡単なメモを添えて聞くとあまり眠くない(<s>睡眠の奴隷&lt; / s&gt;)手が遊んでいますないから覚えが良くなったんですよ。そして、&#x27;講義今日みんなでした〜&#x27;すると終わりで今日学んだ内容の中で私が本当に知らなかった内容がメモ帳に整理が次々となるので、軽くスッと見ながら理解し、復習する時も楽です。 そして、2回毒をする時は直接コーディングを入力しながら見る時はあえて講師様と同じ速度で作るよりも、まず完成本写真+基本構造を見て先に作ってみて、cssたっぷり入れてから、どのように講師様と違って入れたかを比較しながら見るのも楽しいと思います。そうすれば完全に私なのか、私が打者練習だけしたのかよく分かると思います。また、こうすれば質問も質の良い質問が来ることができると思います。 2回毒を終えれば、複数のサイトを見ながらf12を押さずに自分で作ってみるのもいいと思います。ところが2回毒を終えれば(イ・ジョンガンの含む) どんなサイトたちは構造が目に入って氷のようにまねる私の姿を見るようになりましたね! 故に、時間に追われて一回毒に終わるよ!と思うよりも、1回毒は本当に世界で一番楽な姿勢で見て、2回毒で直接コード入力する時は、どんどん残る記憶と思います。とにかく私のような愚か者もある程度追いつく講義とは、他の誰も挑戦する価値のある講義だと思います。 p.s) いや、ところが、この川の初級対象となっているのに、これ初級映像なのでしょうか..?......

    • codingworks
      知識共有者

      aトーリング様~受講坪に本当に入念で詳細ですね。 前もありませんでしたが、これからもこんなに長くて詳細な受講評はないようです。^^ 努力するほどすぐに良い結果があるでしょう。ファイティング!

  • flowerkong31662님의 프로필 이미지
    flowerkong31662

    受講レビュー 5

    平均評価 5.0

    5

    81% 受講後に作成

    これまで聞いたどんな講義よりも、実力向上に役立つ優秀な講義です。理論と実習の両方を理解しやすく、講師は本当に本当に説明を上手にしてください!講師、本当にありがとうございました!アップロードされる講義の皆さん、聞きたい程度で満足度が高いです。 ^^

    • codingworks
      知識共有者

      mmさんこんにちは 講義が役に立ったのは本当に嬉しいですね。 コーディングワークス他の講義も関心をお寄せいただきありがとうございます。 勉強しましょうか、ご質問があれば質問してください。

codingworksの他の講座

知識共有者の他の講座を見てみましょう!

似ている講座

同じ分野の他の講座を見てみましょう!