My Tech Blog (연습)

CSS Diner는 CSS 선택자를 학습하고 연습할 수 있는 재미있는 웹 기반 게임이다.사용자가 HTML 코드에 적용할 올바른 CSS 선택자를 작성하면, 게임의 각 레벨을 클리어하며 점점 더 복잡한 선택자를 익힐 수 있다. 이 게임은 CSS를 배우거나 복습하고 싶은 초보자와 중급자를 위한 좋은 도구이고특히 선택자 공부를 하고 싶은 사람들께 추천한다.크롤링 연습하시는 분들께도 많은 도움이 될 것 같다.  https://flukeout.github.io/ CSS DinerA fun game to help you learn and practice CSS selectors.flukeout.github.io 가장 쉬운 난이도인 1번부터 가장 어려운 32번까지 있다.ㅋㅋ 화면에서 고르라고 하는 물건을 고르는 CSS..

나만 알기에는 아까운 사이트 `Learn Git Branching` 은 Git을 쓸 때 필요한 브랜치에 대한 개념을 잡는 것을 돕기 위해 만들어진 사이트이다. https://learngitbranching.js.org/?locale=ko Learn Git BranchingAn interactive Git visualization tool to educate and challenge!learngitbranching.js.org 처음 접속하면 이렇게 팝업이 뜨는데 ESC 누르면 바로 배쉬창에 아무거나 연습해 볼 수 있다.단계별로 연습하고 싶은 사람은 아래 팝업에서 레벨을 선택하면 된다. 콘솔에 명령어를 입력해도 되고,브랜치 이름을 직접 클릭해도 checkout 이 된다~

안녕하세요오늘은 리눅스 명령어 연습해 볼 수 있는 사이트 소개해드릴게요 JS Linux입니다! https://bellard.org/jslinux/ JSLinuxJSLinux Run Linux or other Operating Systems in your browser! The following emulated systems are available: CPUOSUserInterfaceVFsyncaccessStartupLinkTEMUConfigComment x86Alpine Linux 3.12.0ConsoleYes click here url x86Alpine Linux 3.12.0X WindowYes click hbellard.org 저는 윈도우를 쓰는데요.이 웹사이트 이용하시면 브라우저에서 Linux 환경..

[자바스크립트] html/css/js로 계산기 만들기 제1탄자바스크립트로 간단하게 계산기 만들어 보기 ㅎㅎㅎ 깃허브에 올려야 하는데 깃허브 한 번 정리하고 손봐야 되서 그냥 블로그에 올린다.나중에 전체 소스만 깃허브로 보내기 1. 버튼 16개 만awesomepossum.tistory.com 여기서 손을 좀 대겠습니다 ㅎㅎㅎ기능 추가랑 계산기 색상 추가  1. 숫자 지울 수 있는 backspace 버튼2. 그리고 다중 계산을 위해 숫자와 연산자 입력을 이어서 받을 수 있도록 로직 개선.3. 계산기에 색상 입히기 1. backspace 기능 추가 버튼을 어디다 넣을까 div 태그 한 줄 더 써서 추가할까 하다가 그냥 첫번째 row에 집어 넣어주기로 함...    7    8    9    +    ← 스크립..

자바스크립트로 간단하게 계산기 만들어 보기 ㅎㅎㅎ 깃허브에 올려야 하는데 깃허브 한 번 정리하고 손봐야 되서 그냥 블로그에 올린다.나중에 전체 소스만 깃허브로 보내기 1. 버튼 16개 만들기 7 8 9 + 4 5 6 - 1 2 4 / C 0 = x  여기까지 html로 버튼 16개 만들기이제 script 태그 안에 각 버튼마다 이벤트 리스너 달아줘야 함#num-0과 #num-1에 대해서만 이벤트 리스너 달아주면 이런 식으로 동작함d..

깃허브에 올려야 하는데 귀찮아서 일단 블로그에 먼저 포스팅 1. 시작 2. 몇 명이 참가할 지 선택 prompt3. 참가자 순서 number4. 제시어 저장할 변수 word5. 입력한 단어를 저장할 변수 newWord input 이벤트로 단어 입력 -> 입력 버튼 클릭 -> 입력 단어 newWord에 저장 판단1_제시어가 비어 있는가?판단2_입력한 단어가 올바른 단어인가? (앞 단어의 마지막 글자랑 일치하는가)판단1판단2결과제시어가 비어있음단어가 올바르다입력한 단어가 제시어제시어가 비어있음단어가 올바르지 않다입력한 단어가 제시어제시어가 비어있지 않음단어가 올바르다입력한 단어가 제시어제시어가 비어있지 않음단어가 올바르지 않다올바른 단어 입력하라고 알림창 띄우기 No -> alert('올바른 단어 입력')Y..