강의

멘토링

로드맵

BEST
Game Dev

/

Game Programming

Learning interactive web while making web games! JAVASCRIPT

A three-in-one class where you can create web games and learn front-end web development skills! This class has been created to teach you how to create games using JavaScript, CSS, and HTML with your own ideas!

(4.8) 22 reviews

365 learners

  • ggangcoding162118
Interactive Web
JavaScript
HTML/CSS

Reviews from Early Learners

What you will learn!

  • Naturally learn web animation and interactive web implementation principles while creating games!

Make games and learn FE web development skills!

Lecture Introduction

Web game play video

Recent work projects

Try creating various motions!

Create various motions for heroes that respond to keystrokes, monsters, shurikens, damage effects, and more.

Stop the oncoming monsters!

Let's implement a collision feature and create a game stage that blocks incoming monsters. We'll create a stage that repeats infinitely , and two game stages that the developer specifies .

Talk to NPCs and complete quests!

Create a game quest and a feature that allows you to interact with NPCs . Complete the quest and receive a reward .

Level up and adjust your hero stats!

Let's create a level-up function by managing the hero's health and experience points, and also change the hero's stats.

Class Features

  • The class will be conducted using VanillaJS .
  • I've broken it down into sections as much as possible to make it easier to understand and less boring .
  • We learn by creating together sequentially .
  • It's a fun class because we learn while making games.
  • It deals a lot with arrays, objects, and loops .
  • You can learn various web skills used in front-end development while creating games.
  • It's similar to the principle of creating a game with Canvas, but it's easier to approach using HTML/CSS together.
  • About 9 hours long! We'll explain everything in as much detail as possible. (52 lessons total)
  • Learn a variety of skills that can increase your salary .

Please note

  • Uses JavaScript ES6 syntax.
  • We do not use open source libraries.
  • If you have any questions about the class, please feel free to post them in the Q&A section! We have a strong support team .
  • This course isn't about creating a game aimed at official release. Instead, we'll create a simple web game using HTML, CSS, and JavaScript.
  • You should have a basic understanding of HTML, CSS, and JavaScript. Basic grammar will not be covered in class.
  • Excluding the basic grammar, the implementation principles are explained in as much detail as possible while creating them sequentially.
  • The class weight is approximately 80% JavaScript and 20% HTML/CSS.
  • Free distribution of code from this course is prohibited .
  • The game may have slight differences depending on the system and browser environment.

Expected Questions Q&A

Q. What browsers does it work on?
A. The games we created in class were tested on the latest versions of Chrome, Safari, Opera, Firefox, and Edge .
Q. What are the differences depending on the system environment and browser?
A. Since this is a game that runs on a browser, there may be slight differences in smoothness .
Q. Can non-majors also take the course?
A. I think even non-majors will be able to follow along if they know the basic grammar of HTML, CSS, and JavaScript.

A rich curriculum of 52 lectures and approximately 9 hours of content!
Please check below.

Recommended for
these people

Who is this course right for?

  • For those interested in UI/UX!

  • Job seekers who want to create a special portfolio!

  • Web animation! For those interested in interaction!

  • For those who want to learn various front-end skills!

  • For those who want to increase their skills and raise their salary!

Need to know before starting?

  • JAVASCRIPT, CSS, HTML

Hello
This is

1,332

Learners

71

Reviews

163

Answers

4.7

Rating

3

Courses

안녕하세요. 백엔드 개발자로 시작해 프론트엔드 개발자로 전향해서 UI 개발에 푹 빠져있는 깡코딩입니다. :)

 

10여 년 동안 다수의 기업 홈페이지와 쇼핑몰 SI 소상공인 홈페이지를 제작하며 알게 된 UI/UX 제작 기법 노하우 등을 공유하기 위해 이 강의를 시작하게 되었습니다. 국내 여러 대기업 프로젝트를 경험했고 소상공인에게 초점을 맞춘 홈페이지 제작 사업도 하였습니다.

 

저는 가끔 국내 코딩관련 커뮤니티에서 취미로 만든 애플 인터렉션과 창작 인터렉션을 공유하며 재밌는 기술을 소개했었는데요

많은 분들의 관심을 주셔서 이렇게 강의까지 만들게 되었습니다.

 

제가 만들어갈 강의는 표준 브라우저를 고려하고 실무에서 사용 가능한 감탄사가 절로 나오는 다양하고 멋진 인터렉션과 모션그래픽을 만드는 방법들을 알려드릴 예정이고 프론트 개발자나, 웹퍼블리셔가 솔루션을 이용해 홈페이지, 쇼핑몰 등을 바닥부터 만들 수 있는 강의도 만들 예정입니다.

 

그럼 수업에서 뵙겠습니다 :)

Curriculum

All

55 lectures ∙ (8hr 54min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

22 reviews

4.8

22 reviews

  • truefalse님의 프로필 이미지
    truefalse

    Reviews 1

    Average Rating 5.0

    5

    100% enrolled

    I recommend it because it helps you understand the concept of classes and arrays and object management through fun and repetitive code usage. First of all, I recommend it because I want to keep listening to the lectures because I think about making games more than anything else.

    • ggangcoding162118
      Instructor

      Hello :) Thank you for your valuable review. ^^..

  • pjg408님의 프로필 이미지
    pjg408

    Reviews 1

    Average Rating 5.0

    5

    100% enrolled

    I was interested in interaction, so I started listening, and I think it was easy to understand because it solved difficult js objects, classes, arrays, loops, etc. in an easy and fun way! I made it twice and I will use the concepts I learned to make my own game. Thank you for the great lecture~!

    • Hello:) Junkyu, I remembered you posted a question about implementing a function, but it looks like you solved it on your own :) Congratulations. Thank you for your valuable review :)

  • sprout0719002828님의 프로필 이미지
    sprout0719002828

    Reviews 6

    Average Rating 4.7

    5

    100% enrolled

    Thanks to the lecture, I learned about various functions and implementation methods. Above all, I was able to grasp the concepts of Object and Class. This reason alone is enough reason to listen to it:D Thank you for the great lecture.

    • Hello :) I'm glad it was helpful! Thank you for your valuable review. Happy New Year^_^

  • 1988bgh님의 프로필 이미지
    1988bgh

    Reviews 7

    Average Rating 5.0

    5

    36% enrolled

    I have taken many lectures on creating interactive webs at Infraon, but this one is really useful and helpful! The lecture time is good, and the content is really good! Thank you for the great lecture. I also want to train a lot and create lectures that will help someone later! Happy New Year 2022!

    • Hello :) I'm so happy to see such a cheerful article starting the new year, but on the other hand, I feel heavy-hearted and strong :) Thank you. I hope you have a very happy new year and that only good things will happen to you ^___^

  • vxggangxv0556님의 프로필 이미지
    vxggangxv0556

    Reviews 7

    Average Rating 5.0

    5

    55% enrolled

    The friendly and step-by-step lectures stand out!~ I'll do it, it's good

    • Hi :) I'm glad it helped! Thank you for your valuable review :D

$68.20

ggangcoding162118's other courses

Check out other courses by the instructor!

Similar courses

Explore other courses in the same field!