본문 바로가기

분류 전체보기204

[RummiKub/JS] 타일 클릭 시 후광 효과 결과물 CSS 타일 클릭 시 추가할 class의 스타일을 미리 추가합니다. .tile-click{ border-radius: 10px; background-color: rgb(255, 181, 43); box-shadow: 0px 0px 5px 5px rgb(255, 188, 43); } JS 1. 선택한 타일의 정보 찾기 타일의 정보를 찾기 위해서는 이전의 코드를 조금 수정해야합니다! 타일을 띄우는 과정에서 타일 고유의 id를 부여하고 그 id를 가진 이미지 태그를 찾는 방식으로 정보를 찾을 예정입니다. 수정 코드 설명 태그에 id 추가 i번째 타일의 id 값으로 추가 onclick onclick 시 함수에 id값을 넘겨줌 show_player_tile() 수정 function show_player_t.. 2021. 11. 18.
[RummiKub/JS] 타일 나누기 규칙 - 총 타일 수 : 104 (빨강, 노랑, 파랑, 검정 * 2묶음* 13장씩 / 4 * 2 * 13) - 나눠가지는 타일 수 : 14 이미지의 오른쪽은 타일 저장한 이름 결과물 HTML check.html 플레이어 타일 AI 타일 남은 타일 CSS check.css * { list-style: none; text-decoration: none; border-collapse: collapse; margin: 0 auto; padding: 0; color: #000; } .tile { margin: 5px; height: 11vh; -webkit-user-drag: none; cursor: pointer; } .main-board{ margin: 30px; height: 100vh; width: 84v.. 2021. 11. 18.
[JS] RummiKub 프로젝트 고2 때 바닐라 JS로 구현한 로봇과 플레이하는 1:1 루미큐브 게임입니다. Play game!! 게임 설명 공식 규칙 사용자와 로봇이 타일을 14개씩 나누어 가집니다. 사용자부터 시작하여 1분씩 메인 보드에 타일을 추가할 수 있습니다. 자신의 타일을 모두 메인 보드에 추가하는 플레이어가 승자입니다. 조작 방법 루미큐브 온라인과는 다른 타일 추가 방법을 알려드리겠습니다. 플레이어 보드 → 메인 보드 1. 플레이어 타일에 타일을 한 개씩 클릭해주세요. 2. 타일들이 클릭된 상태에서 메인 보드를 클릭해주세요. 메인 보드 → 플레이어 보드 1. 플레이어 보드에 다시 추가할 타일을 한 개식 클릭해주세요. 2. 플레이어가 가진 타일 중 마지막 회색 버튼을 클릭하면 타일이 제자리로 돌아옵니다. 화면 소개 제한 시간.. 2021. 11. 17.
[3분 코딩] 끝 앱 소개 - Notion 그래프가 극단적이긴 하나 일요일날 밤 새서 서버를 구현했다... ^~^ 2021. 11. 10.
Happy Halloween 할로윈이라고 잔디밭이 호박밭이 됐다!! 2021. 10. 31.
[Node.js] 2021 Mirim Tech Talk Hackathon 딱 추석동안 스택만 부여잡고 있어서 해커톤이 끝난 주말동안 만들어보았다. 게시판을 만드는 프로젝트로 CRUD를 구현해보았다. 1. Node.js 초기 세팅 이렇게 또 찾아볼까봐 블로그에 정리했다. 2. db 설계 CREATE TABLE board ( id INT PRIMARY KEY AUTO_INCREMENT, title VARCHAR(100) NOT NULL, description TEXT NOT NULL ); 해커톤에서 주어진 컬럼은 title과 description으로, 기본적으로 테이블에는 PK값이 필요해 id를 자동생성으로 주었다. 3. router 나누기 app.js에 boardRouter로 /boards 폴더와 연결한다. app.js const boardRouter = require('./r.. 2021. 9. 25.
[Node | ubuntu] ubuntu에서 Node.js 세팅 1. MySQL 설치 https://dejavuqa.tistory.com/317 이 천재님만 따라하면 잘 설치된다 ^^b 더보기 root 변경 sudo su MySQL 제거 https://newly0513.tistory.com/162 비밀번호 재설정 ALTER USER 'root'@'localhost' IDENTIFIED BY '비번'; 이지만 조건을 충족시키지 않아서 자꾸 거절당했다. ERROR 1819 (HY000): Your password does not satisfy the current policy requirements !! 조건 !! 대문자 1개이상 소문자 1개 이상 숫자 1개 이상 특수문자 1개 이상 글자수 8 ~ 그렇게 탄생된 내 비번 -- mysqlStac2021! 참고 블로그를 통해.. 2021. 9. 4.
[Node] AWS ec2 + putty 참고 자료 및 정리 참고자료 ec2 생성 및 putty 설치 및 연결 코알라일락님 https://blog.naver.com/zion830/221353306321 ec2 + Node.js https://hoontae24.github.io/posts/10 AWS EC2 + RDS에 Node.js 서버 배포하기(Ubuntu, Mysql) 보통의 웹 서비스는 서버를 이용하여 서비스를 제공합니다. 서버 컴퓨터를 직접 구성해서 할 수도 있지만, 요즘에는 클라우드 서비스를 많이 이용합니다. 클라우드 서비스를 이용하면 물리적으 hoontae24.github.io putty 명령어 https://smiler.tistory.com/entry/Putty-명령어 [아직은 내가 쓴 글보다 퍼온 글이 훨씬 많음] vim https://opentut.. 2021. 9. 3.
[Node] Node.js MySQL 연동 및 로그인 디비 생성 1. MySQL 설치 npm install -g mysql PS D:\Node.js> npm install -g mysql + mysql@2.18.1 added 11 packages from 15 contributors in 1.439s 1.5 계정 추가 참고 블로그 2. db, table 생성 db 이름 : mw_db table 이름 : user CREATE DATABASE mw_db; CREATE TABLE USER ( ID INT PRIMARY KEY AUTO_INCREMENT, NAME VARCHAR(10) NOT NULL, EMAIL VARCHAR(30) NOT NULL UNIQUE, PASSWORD VARCHAR(200) NOT NULL ); 디비 생성 및 테이블 생성, 조회 A to Z 는 .. 2021. 8. 31.

티스토리툴바