전체보기806

• 

  테트리스 게임 개발 #7 - 최고 점수 표시, 블럭 색깔 추가, 배경음악 및 효과음 적용 목차 지난 강의 리뷰 테트리스 게임 개발 #6 - 시작, 종료, 일시 정지 및 레벨, 라인, 점수 계산 기능 구현 테트리스 게임 개발 #6 - 시작, 종료, 일시 정지 및 레벨, 라인, 점수 계산 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #5 - 하드 드랍 및 라인 제거 기능 구현 테트리스 게임 개발 #5 - 하드 드랍 및 라인 제거 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #4 - 블럭 쌓 sangminem.tistory.com 점점 게임의 완성도가 높아지고 있습니다. 기세를 몰아서 더욱 높여 보겠습니다. 1. 최고 점수 표시 2. 블럭 색깔 추가 3. 배경음, 효과음 적용 위 3가지 사항을 이번에도 거침없이 적용할 예정이에요. 소스 코드 재정비 잠시 다시 한 번 코드 관리하기 좋.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 24.

• 

  테트리스 게임 개발 #6 - 시작, 종료, 일시 정지 및 레벨, 라인, 점수 계산 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #5 - 하드 드랍 및 라인 제거 기능 구현 테트리스 게임 개발 #5 - 하드 드랍 및 라인 제거 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #4 - 블럭 쌓는 로직 작성 테트리스 게임 개발 #4 - 블럭 쌓는 로직 작성 목차 지난 강의 리뷰 테트리스 게임 개발 #3 - 블럭 이동 기능 구현 테트리스 게임 sangminem.tistory.com 지난 시간까지 기본적인 테트리스의 기능은 구현이 완료 되었습니다. 지금부터는 부가적인 기능을 구현해 보는 시간을 갖도록 할 거예요. 1. 게임 시작, 종료, 일시 정지 2. 레벨, 라인, 점수 계산 위와 같은 기능이 추가 되어야 더욱 게임 다운 게임이 되겠죠. 게임 시작, 종료, 일시 정지 일단 게임 시작, 일시 .. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 23.

• 

  테트리스 게임 개발 #5 - 하드 드랍 및 라인 제거 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #4 - 블럭 쌓는 로직 작성 테트리스 게임 개발 #4 - 블럭 쌓는 로직 작성 목차 지난 강의 리뷰 테트리스 게임 개발 #3 - 블럭 이동 기능 구현 테트리스 게임 개발 #3 - 블럭 이동 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 테트리 sangminem.tistory.com 지금부터는 테트리스의 필수적인 기능을 마무리 하는 시간을 가져 보겠습니다. 1. 하드 드랍 2. 라인 제거 3. 게임 종료 위와 같은 순서로 작성을 한 번 해볼게요. 하드 드랍 기능 구현 먼저 하드 드랍 기능입니다. 그러기 위해 새로운 키를 등록해야 겠죠. function keyHandler(event) { const inputKey = e.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 20.

• 

  테트리스 게임 개발 #4 - 블럭 쌓는 로직 작성 목차 지난 강의 리뷰 테트리스 게임 개발 #3 - 블럭 이동 기능 구현 테트리스 게임 개발 #3 - 블럭 이동 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #1 - 소개 및 기본 화면 sangminem.tistory.com 이번에는 다음과 같은 기능을 구현해 보겠습니다. 1. 블럭이 위에서 아래로 자동으로 내려오고 2. 블럭이 바닥에 도달하면 새로운 블럭을 다시 내려오도록 해 볼게요. 3. 그런 다음 내려온 블럭을 쌓아 보겠습니다. 블럭 애니메이션 효과 애니메이션 효과를 주기 위해서는 window.requestAnimationFrame() 메서드를 이용하면 됩.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 18.

• 

  테트리스 게임 개발 #3 - 블럭 이동 기능 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #1 - 소개 및 기본 화면 구성 테트리스 게임 개발 #1 - 소개 및 기본 화면 구성 게임 개발 하면 제일 먼저 떠 오르는 종류가 보드 게임, 그 중에서도 테트리 sangminem.tistory.com 앞서 main-board와 next-board에 block을 표시하는 것까지 해 보았는데요. 이번 포스팅에서는 직접 조작을 해 보겠습니다. 1. board에 표시된 block을 방향키로 움직여 보도록 할게요. :) 2. 그 전에 JavaScript 파일을 정비하고 가야 할 필요가 있어보입니다. 소스 코드 정비 하나의 파일에 체.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 16.

• 

  테트리스 게임 개발 #2 - 블럭 모양 및 랜덤 선택 구현 목차 지난 강의 리뷰 테트리스 게임 개발 #1 - HTML, 자바스크립트, CSS를 활용하여 기본 화면 구성 테트리스 게임 개발 #1 - HTML, 자바스크립트, CSS를 활용하여 기본 화면 구성 게임 개발 하면 제일 먼저 떠 오르는 종류가 보드 게임, 그 중에서도 테트리스가 아닌가 싶어요. 게다가 최근 웹 언어가 활용도가 높고 그 만큼 관심이 커지고 있기 때문에 지금부터 순수 HTML, Ja sangminem.tistory.com 지난 포스팅에서는 테트리스 게임을 만들기 위해 아래와 같이 기본적인 틀만 간단히 구현해 보았는데요. 1. 지금부터는 main-board와 next-board에 특정 블럭을 선택하고 2. 선택된 블럭을 그려 볼게요. 블럭 모양 구성 테트리스 게임에서는 아래와 같이 블럭의 모양을.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 12.

• 

  테트리스 게임 개발 #1 - HTML, 자바스크립트, CSS를 활용하여 기본 화면 구성 게임 개발 하면 제일 먼저 떠 오르는 종류가 보드 게임, 그 중에서도 테트리스가 아닌가 싶어요. 게다가 최근 웹 언어가 활용도가 높고 그 만큼 관심이 커지고 있기 때문에 지금부터 순수 HTML, JavaScript, CSS 만을 이용하여 테트리스 게임을 만들어 보기로 할건데요. 목차 데모(Demo) 완성되면 위처럼 동작을 합니다. (실제 플레이 가능합니다) 기대되지 않나요? ㅎㅎ 테트리스 - 민이게임 테트리스 민이게임 sangminem-game.web.app 깃허브(GitHub) 소스 공유 GitHub Sangminem Tetris sangminem/tetris made with javascript, html, css. Contribute to sangminem/tetris development by c.. 코딩 강의/컨텐츠를 만들어 볼까요 2020. 9. 10.

• 파이썬 조건문 (if, 딕셔너리 활용) 조건문에 대해 간단히 알아 보겠습니다. 1. if 문 test = 5 if test > 참입니다 조건이 하나만 있는 if 문입니다. 10은 5보다 작으므로 조건이 참이 되고 '참입니다' 문구가 출력됩니다. test = 15 if test > 두번째 조건이 참입니다 다음은 조건이 2개가 있는 if/elif 문 입니다. 조건이 2개 이상 있을 경우는 elif 문으로 추가하면 됩니다. 여기서 15는 10보다 작지 않으므로 첫번째 조건이 만족하지 않고 20보다는 작으므로 두번째 조건이 만족하여 '두번째 조건이 참입니다' 가 출력.. 프로그래밍 & IT 정보/Python 2020. 9. 2.

• 파이썬 반복문 (for, while) 자주 쓰이는 반복문에 대해 간단히 알아보겠습니다. 1. for 문 test_list = [1,2,3,4,5] for test in test_list: print(test) # 출력 결과 # 1 # 2 # 3 # 4 # 5 test_list 배열의 데이터 개수만큼 반복하여 수행됩니다. for i in range(5): print(i) # 출력 결과 # 0 # 1 # 2 # 3 # 4 range 메서드를 사용하면 원하는 범위만큼 반복 수행이 가능합니다. 2. while 문 test_list = [1,2,3,4,5] cnt = 0 while cnt != len(test_list): print(test_list[cnt]) cnt += 1 # 출력 결과 # 1 # 2 # 3 # 4 # 5 while문은 조건이 참.. 프로그래밍 & IT 정보/Python 2020. 9. 2.

• 

  파이썬 BeautifulSoup 파싱(Parsing) 다양한 방법 파이썬을 공부하면서 html 문서에서 특정 태그를 가져오는 다양한 방법에 대해 정리를 해 보았습니다. 다음과 같은 HTML 문서가 있다고 가정을 하고 BeautifulSoup 모듈을 이용해서 특정 태그를 파싱해 오는 방법을 하나씩 보도록 할게요. from bs4 import BeautifulSoup html = """ Content1 Content2 Goal Content3 """ soup = BeautifulSoup(html, "html.parser") 목표는 아래 태그입니다. Goal 1. find() 메서드 활용 print(soup.find('div',id='target')) #tag, id print(soup.find('div',attrs={'id':'target'})) #tag, 속성으로서의 i.. 프로그래밍 & IT 정보/Python 2020. 9. 2.

• 

  [왕초보 코딩 6강] 웹 계산기 만들기 2 - HTML, JavaScript(자바스크립트) #지난강의 sangminem.tistory.com/23 [왕초보 코딩 5강] 웹 계산기 만들기 1 - HTML, JavaScript(자바스크립트) 지금까지는 내가 얼마나 코딩에 흥미를 느낄 수 있을까 알아보기 위한 시간이었다면 5강부터는 그 흥미를 바탕으로 조금씩 실력을 늘려가는 시간을 가져보도록 할거예요 이 강의는 자연스럽게 sangminem.tistory.com 안녕하세요. 5강을 보지 않으신 분은 5강부터 봐주시기 바랄게요. 이어서 웹 계산기 만들기를 진행하겠습니다. 지금부터는 값1, 값2, 연산자에 값을 넣고 계산하기 버튼을 누르면 결과에 계산된 값이 찍히게끔 기능을 만들어 보도록 하겠습니다. 그리고 입/출력된 값들을 모두 지우는 초기화 기능도 만들어 보겠습니다. 자 그럼 진행해 볼게요. 값1: .. 코딩 강의/왕초보인데 가능할까요 2020. 9. 2.

• 

  [왕초보 코딩 5강] 웹 계산기 만들기 1 - HTML, JavaScript(자바스크립트) #지난강의 sangminem.tistory.com/22 [왕초보 코딩 4강] 프로그래머 첫걸음 이 글을 우연히 보고 들어오신 분이 대부분이겠죠? 만약 꾸준히 공부할 마음이 생겨서 일부러 찾아 오신 분이라면 책임지고 끝까지 가르쳐 드리겠습니다. 열정만큼은 이미 합격입니다. 코딩 별 sangminem.tistory.com 지금까지는 내가 얼마나 코딩에 흥미를 느낄 수 있을까 알아보기 위한 시간이었다면 5강부터는 그 흥미를 바탕으로 조금씩 실력을 늘려가는 시간을 가져보도록 할거예요. 이 강의는 자연스럽게 코딩과 가까워지고 싶은 분들을 위한 것이므로 진행에 있어서 필요하지 않은 교과서적인 설명은 따로 하지 않습니다. 또한 코딩 왕초보를 위한 강의인 만큼 전문적인 용어는 가급적 쓰지 않고 이해를 바탕으로 진행하겠.. 코딩 강의/왕초보인데 가능할까요 2020. 9. 2.