본문 바로가기

분류 전체보기464

[Vanilla JavaScript] 타이핑 게임 ■ 참고 영상 https://youtu.be/_CsGSE5gwTA ■ 게임 동작 1. 게임시작 버튼을 누르면 카운트 다운이 시작된다. 2. 주어진 시간 내에 인풋 창에 나타난 문자를 입력하면 점수 획득 3. 점수 획득 시 랜덤하게 단어가 주어진다. 4. 시간 내에 획득하지 못하면, 게임이 종료된다. 5. 재시작을 원할 경우에는 다시 게임 시작 버튼을 누른다. ■ 게임 기능 게임 시작 초기설정 입력창 자동 포키싱 setInterval, clearInterval 활용 text 설정에 따라 button 화면 나타나게 하기 axios 활용 받아온 데이터 중 특정 단어들만 나타나게 하기 단어 일치할 경우, 입력창 초기화 random 단어들이 나오게 만들기 ■ 코드 // 사용변수 const GAME_TIME = 9.. 2023. 3. 15.
Antiviurse 오류해결 어느 순간, React 프로젝트를 만들려고 했는데, 아래와 같은 에러가 발생했다. 지인들한테 물어봐도 모른다는 회신뿐이었다. 구글에 검색해보니, 그렇게 많은 정보가 나와 있지 않았다. 그리고 영어로 된 글들 뿐이라 숨이 턱턱 막혔다. 그래도 어쩌랴. 목 마른 사람이 우물 파야지. 천천히 영어로 된 사례와 해결방법들을 읽어보았다. 따라해보았으나 잘 되지 않았다. 참고 링크 1에 있는 대로 cache들을 지워보고 해봤지만 소용 없었다. 그러다가 antivirus 라는 게 눈에 띄었다. 이것을 검색해보니, 어베스트라는 보안프로그램이 나온다. 그냥 단순하게 생각하고 지웠다. 그랬더니 문제가 해결되었다. 에러 내용 installing packages. this might take a couple of minute.. 2023. 3. 10.
5. 컴포넌트(Component) 23.03.10 ver 1. 참고 도서 & 자료 리액트를 다루는 기술(초판 9쇄 22.06.30) http://aladin.kr/p/NMeIK 리액트를 다루는 기술 리액트 베스트셀러 1위, 리액트를 다루는 기술 개정판. 리액트 16.8 버전에 Hooks라는 기능이 도입되면서 함수형 컴포넌트에서도 상태 관리를 할 수 있게 되었다. 이에 맞춰 책에 사용된 주요 예시 www.aladin.co.kr 2. 컴포넌트의 기능 단순한 템플릿 이상이다. 데이터가 주어졌을 때 이에 맞추어 UI를 만들어 준다. 라이플사이클 API를 이용하여 컴포넌트가 화면에서 나타날 때, 사라질 때, 변화가 일어날 때 주어진 작업들을 처리할 수 있다. 임의 메서드를 만들어 특별한 기능을 붙여줄 수 있다. 컴포넌트를 선언하는 방식 리액트 공.. 2023. 3. 10.
코드블록 색상 입히는 방법 https://lapina.tistory.com/75 2023. 3. 7.
통합 후 삭제예정 23.03.07 ver 1. 참고 도서 & 자료 웹 표준의 정석 http://aladin.kr/p/Fyssu Do it! HTML + CSS + 자바스크립트 웹 표준의 정석 《Do it! HTML5+CSS3 웹 표준의 정석》의 저자는 ‘HTML, CSS, 자바스크립트를 한 권으로’ 배우고 싶다는 많은 독자의 요구를 모아 최신 경향을 반영한 이 책을 집필했다. 웹 개발을 시작하는 입문자도 www.aladin.co.kr 2. 자바스크립트 언어의 큰 줄기, 식(expression)과 문(statement) 식은 표현식이라고도 하며, 연산식뿐만 아니라 실제 값도, 함수를 실행하는 것도 식이 된다. 4*29 // 연산식은 식 "안녕하세요?"; // 문자열도 식 921 // 숫자도 식 문은 명령이다. 문의 끝에는 .. 2023. 3. 7.