강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Web Publishing

モバイル、タブレット、pcレスポンシブインスタグラムクローンコーディング

この講義を通じて、受講生はHTML、CSS、JSでインスタグラムに似たWebサービスを作成することができます。 (フロントのみ実装しました!バックエンドサーバー構築は今後講義撮影予定です。)

  • jeong4726
인스타그램
클론코딩
HTML/CSS
JavaScript
Clone Coding

こんなことが学べます

  • vscode設定、必須拡張設定

  • CSS BEMルール

  • reset.cssを利用した初期設定、フォルダ、ファイル構造の作成

  • メディアクエリを活用したモバイル、タブレット、pcデバイスの最適化

  • flexboxを活用したソート

  • (position、transition、transform(translate関数))を活用

  • gridを活用した画面配置

  • 検索、通知、その他のアニメーションの実装

  • 純粋なjavascriptを活用したWebカルーセル、モバイルタッチカルーセルの実装

  • javascript 基本文法(変数、関数、条件文、反復文(for、forEach、while)、配列、オブジェクト、オプションチェイン、arrow function、イベント委任(キャプチャ、バブリング))を活用

  • javasript DOM操作を活用したレンダリング

  • 純粋なjavascriptを活用したカテゴリフィルタリングの実装

  • 書き込み、コメント、共有モーダルウィンドウ、dim処理の実装

  • 画像アップロード、動画再生、動画無音処理の実装

  • navBar(サイドバー、トップ、ボトムバー)実装、モバイルウェブに合わせてナビゲーションバーを最適化

  • ログイン、会員登録、ホーム、リール、ナビゲーション、メッセージ、プロフィールページの実装

  • ブックマーク、良い実装

  • フォントアサムを活用してアイコンを適用する

  • 共通コンポーネントの分割

  • github-pagesを使用した配布

その講義を受講すると、実装する機能

ログイン

もっと見る

会員登録

検索、アラーム

メッセージ

カルーセル

リールズ

カードリスト

共有モーダル

いいね、ブックマーク

コメントモーダル

投稿作成モーダル

ナビゲーションページ

プロファイルのフィルタリング

一般人99%のためのIT基礎知識講義、HTMl、CSS、JS文法講義に続く第3講義です!

今回はhtml、css、jsを活用してWebサービスを作りたい方のために準備した講義です。

この講義を受講する前に、一般人99%のためのIT基礎知識の講義を選手講座すればさらに理解が速いですが、聞かなかったとしても受講することには問題ありません。

>>一般人99%のためのIT基礎知識講義無料で聞きに行く(クリック)

ただし、この講義を受講する前にHTML、CSS、JSに関する基本知識は、受講する際に理解が可能です。

-> html, css, js ワンチョボ 無料で脱出 クリック

私の現業経験を溶かした講義です!

私は試行錯誤を経験して学んだノウハウを込めました。

その講義の画像とビデオは

https://picsum.photos

https://pravatar.cc

https://fontawesome.com/search?q=card&o=r&m=free

https://unsplash.com/ja

https://pixabay.com/ja/

を参照しました。

受講時に必要な資料とソースコードは、最初の講義とセクションの隙間を講義資料として添付しました。

長い記事を読んでくれてありがとう、幸せなことだけがいっぱいです。

こんな方に
おすすめです

学習対象は
誰でしょう?

  • サービスを作りたい人

  • Webとアプリの開発に興味がある方

  • ライブラリ、フレームワークを使わずに純粋なhtml、css、javascriptだけを利用してサービスを作りたい方

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

  • html

  • css

  • javascript

こんにちは
です。

8,063

受講生

159

受講レビュー

4

回答

4.5

講座評価

9

講座

수강하시는 분들은 IT 계열에 관심 있으실 것 같습니다.
수강하시는 모든 분들이 원하는 목표 성취하셨으면 좋겠습니다.

많은 수강 바래요.

 

 [현업개발 이력] 
2019.03.02 ~ 현재 개발

 

[학력]

경희대학교 전자공학과 졸업 ( 학사 )

カリキュラム

全体

91件 ∙ (12時間 57分)

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

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

受講レビュー

全体

1件

5.0

1件の受講レビュー

  • 이종운님의 프로필 이미지
    이종운

    受講レビュー 35

    平均評価 5.0

    5

    100% 受講後に作成

    자바스크립트랑 html css 배워놓고 비디오랑 슬라이드 반응형 만들지 몰라서 막막했는데 강의덕분에 어떻게 해야하는지 알게되서 감사합니다

    ¥3,514

    jeong4726の他の講座

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

    似ている講座

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