강의

멘토링

커뮤니티

Programming

/

Front-end

Real! Website Creation! Step By Step! ('Full Page Site Creation')

Real! Website production Step By Step! This is a process of making the main page of Phomein (https://www.phomein.com/brand/main/main.do) as it is. This is a process of making and implementing the gorgeous interactive web contained in the site as it is, and it will teach you the practical core know-how to easily and quickly make even complex layouts^^

(3.5) 4 reviews

102 learners

Level Basic

Course period Unlimited

  • jyoung
HTML/CSS
HTML/CSS
Interactive Web
Interactive Web
Clone Coding
Clone Coding
jQuery
jQuery
HTML/CSS
HTML/CSS
Interactive Web
Interactive Web
Clone Coding
Clone Coding
jQuery
jQuery

What you will gain after the course

  • How to create a layout that's suitable for your practice!

  • How to create a full-page scrolling layout!

  • How to create a GNB navigation with depth!

  • How to make a number countup!

  • How to create an image slideshow with animation!

  • How to create various scroll animations!

A website where you can learn by creating your own!
Challenge yourself with clone coding with J. Young.

I know HTML tags and CSS properties, but
You say that creating layouts is someone else's story?

You can create a real website layout by creating a layout that is already available!


If you only know HTML and CSS
Interactive web creation OK!

  • This course is designed for those with basic knowledge of HTML and CSS and will proceed by implementing actual web pages.
    • Master the basics of HTML Markup and CSS design!
    • Practice! Gain confidence and excitement in layout creation by exploring a variety of layout creation examples!
    • Try your hand at cloning layouts!


Step By Step!
Get started right now.

You can learn everything from the basics of jQuery to its use in creating web pages, and we will help you create cool and colorful web pages in a short period of time by utilizing various libraries and plugins.

You can acquire both work skills and core practical know-how at once through webpage lectures composed of interactive elements essential for practical work.

The real deal is speed and scalability.
Only those who can quickly complete high-quality projects within the given timeframe will be recognized and treated as skilled designers and publishers.

Let's build a domain site together and learn the know-how to quickly create a stunning website!


  1. How to create an accurate layout using HTML and CSS suitable for practical use
  2. How to Create a Fullpage Scrolling Layout
  3. How to create a Depth GNB network
  4. How to make a number countup
  5. Animations that occur during various scrolls
  6. How to Create Image Slides with Animation

Curious about real-world examples?

Fullpage layout
Image slide
GNB Navigation
Fullpage Navigation

20 years of practical experience and lecture know-how
J.young

Hello? This is J.young.

For over 20 years, I've been leading a design team at a web design and app development company. In my spare time, I teach UI/UX design, web design, web publisher, and front-end development at universities, schools, and vocational training institutions. I aim to train students with no prior design or coding experience to become professionals, including web designers and publishers.

  • From basics to practice!
  • What you want in practice!
  • Create a portfolio that can be used right away in practice!

Through our courses, we guide students to confidently enter the workforce as professionals. As a result, many of our students are now demonstrating their capabilities as working designers and publishers.

  • People who want to become a web designer or publisher but don't know where or how to start
  • People who want to attend a regular course for job change but can't even think about it due to work life
  • People who don't even know the 'code' of coding
  • Those who have learned the basics of HTML/CSS through academies or YouTube, but who have never learned how to create a website

J.young is here to help!

Also, if you have any questions while learning, please leave a comment and I will do my best to provide helpful answers.

Open chat room operation

For a smoother learning experience, join the Jalnan Webdi open chat room run by J.young.
We'll share some great tips and free webinar links related to Figma, UI/UX, coding, and portfolio creation.

- Open chat room name: Jalnan Webdi
- Code: jyoung

Work experience

  • 2015~2017 Managing Director, Elicell Co., Ltd.
  • 2003~2015 Managing Director, Amusingware Co., Ltd.
  • ~2003 Seowoo C&D Design Director

Lectures and other experiences

  • Running a well-known webtoon YouTube channel
  • Incheon Arts College (multimedia web lectures)
  • Seoul Hyundai Vocational School (Smart Web/App Lectures)
  • Polytechnic University (Design Lecture)
  • Korea IT College (Multimedia Design Course)
  • Dudurim Vocational School (Design Class)
  • Gwangmyeong City Women's Vision Center (Web Design Class)
  • Now Computer Academy Bundang Branch (Design Lecture)
  • The Joeun Computer Academy Seocho Branch ([Web Design Specialist] Digital Web & App Design - Course Evaluation-Type Qualification-A)
  • HiMedia Computer Academy Seocho Branch (UI/UX Web Design & Web Publishing Using Video)

Recommended for
these people

Who is this course right for?

  • Those who have basic knowledge of HTML/CSS but are afraid of creating web pages

  • Anyone who wants to quickly create a portfolio for employment as a web designer or publisher

  • Anyone who wants to learn the jQuery source code needed on the web

  • Anyone who wants to easily implement interactive web required in practice without basic JavaScript knowledge

  • Currently a graphic designer who wants to transition to a front-end developer or publisher

  • Anyone who wants to improve their work skills as a web designer

  • Anyone who wants to quickly implement an interactive web with scalability in mind

Hello
This is

9,037

Learners

366

Reviews

227

Answers

4.8

Rating

14

Courses

"디자인.개발 포트폴리오 멘토 J.Young입니다."

저는 지난 20년간 웹 디자인 및 앱 개발 회사를 운영하며 현장의 치열함을 몸소 겪어왔습니다. 그 경험을 바탕으로 현재는 대학과 전문 교육 기관에서 UI/UX 디자인부터 프론트엔드 개발까지, 후배 전문가들을 양성하는 데 매진하고 있습니다.

저의 강의 철학은 명확합니다.

  1. 기초부터 실무까지 막힘없는 연결

  2. 현업이 원하는 핵심 기술의 압축

  3. 취업 성공을 부르는 실무형 포트폴리오 완성

어디서부터 시작할지 막막하신 분, 이직을 꿈꾸지만 시간이 부족한 직장인, 그리고 코딩이 남의 이야기처럼 느껴지는 초보자분들까지. 제가 걸어온 20년의 길을 여러분의 지름길로 만들어 드리겠습니다. 당당히 실무자로 서는 그날까지, 여러분의 든든한 사수가 되어 최선을 다해 돕겠습니다.

J.young이 도와드리겠습니다.!!
또한!! 학습하시다 궁금하신 점 있으시면 댓글 남겨주시면
도움이 드릴 수 있는 답을 드리도록 최선을 다하겠습니다.

실무경력

- 2017~현) 웹개발 Director
- 2015년~2017년(주)엘리에셀 총괄 이사
- 2003년~2015년 (주)어뮤징웨어 총괄 이사
- 2003년: 서우씨앤디 디자인실장


- 현)
- UIUX웹기획/ 디자인/프론트엔드 부트캠프 강사 (이젠DX아카데미 -서초점)
- 디자인.개발 포트폴리오 전문 강의 및 그룹 및 개인 지도

 
* 운영중인 유튜브 (코딩하는 디자이너)

보다 원활한 학습을 위해, J.young이 운영하는 잘난웹디 오픈채팅방에 가입하시면,
강의 질문과 포트폴리오 관련 피드백 드립니다.

- 오픈채팅방명 : 잘난웹디
- 코드 : jyoung

 

Curriculum

All

16 lectures ∙ (2hr 31min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

4 reviews

3.5

4 reviews

  • joofeel00005834님의 프로필 이미지
    joofeel00005834

    Reviews 1

    Average Rating 5.0

    5

    50% enrolled

    great.

    • jyoung
      Instructor

      Thank you for your class review, Mr. Joo Pil-gyu. I hope you study hard and develop the skills to create interactive web. Thank you~ J.young Dream

    • jyoung
      Instructor

      Thank you for your course review, Mr. Joo Pil-gyu. If you have completed the domain, I highly recommend Musein and Daebang Interactive Web. I think it will be helpful for understanding the layout box structure, and for creating responsive web and interactive web, and for using it in web portfolios. Good luck with your studies~~ Thank you^^ J.young Dream

  • office1895님의 프로필 이미지
    office1895

    Reviews 1

    Average Rating 3.0

    3

    100% enrolled

    It would be nice if you could explain more about the library and how to download and apply it. (slick and fullpage) The library description ends with the attached file and a little explanation, but it leaves a lot to be desired. The lecture is fast-paced because the term is edited every time it is spoken, but it can be adjusted to fit if the speed is slowed down. However, the code for using fullpage and transition is simple, so it is easy to use. And if there was a file with only the library added instead of a completed file, it would have been much cleaner to follow the code. Thank you for the great lecture.

    • gudghk07212222님의 프로필 이미지
      gudghk07212222

      Reviews 1

      Average Rating 3.0

      3

      50% enrolled

      The speed is so fast that I'm just following along and I'm busy... I don't know if you edited the video quickly, but before you finish speaking, another word keeps coming out... You edited the coding, so it's faster than your typing speed... It's 2 hours long, but it feels like 4~5 hours. I paused and played it again... It's still fast even at 0.75x speed... ㅋ... The explanation of the slick slider and full page seem a little lacking. I don't understand it well... And there are parts of the video that are cut off and parts that are automatically skipped, so it's a shame. But if you follow along, you can probably set up a homepage. And, I don't think beginners or novices should listen to this. I recommend that you learn some coding before listening to the lectures.

      • hyeree19930226님의 프로필 이미지
        hyeree19930226

        Reviews 1

        Average Rating 3.0

        3

        100% enrolled

        The lecture is good :) It's a bit disappointing that the mobile screen doesn't work. And the lecture is a bit fast ㅠㅜ

        • jyoung
          Instructor

          HYEREE AHN~ This main lecture is designed to teach you how to create a full page, countup, animation that runs when active, GNB MenuBar, etc. If you want to study responsiveness, you can take the DobdaApplication or Musein lecture. And the video was edited quickly on purpose to eliminate boredom. Online lectures have the advantage of being able to be listened to repeatedly~~ Have a good day today~ J.young Dream

      $24.20

      jyoung's other courses

      Check out other courses by the instructor!

      Similar courses

      Explore other courses in the same field!