본문 바로가기

전체 글

2022 Last Challenge : DB설계 기본 시스템 구조도 사용자 로그인 방식은 OAuth로만. 사용자 별로 파티를 갖고 있으며, 파티에는 파티 호스트가 존재한다. + 사용자는 뱃지를 가지고 있음 파티 별로 챌린지가 존재하며, 챌린지 내에 사용자 별 세부 목표(타겟)이 존재한다. 파티 내에는 포스팅이 존재하며, 포스팅은 타겟과 챌린지를 갖는다. 코멘트를 통해 포스팅을 인증할 수 있다. ERD badge user.badge user user.party party // 사용자 목록 Table user as U { id int [pk] //type 결정 필요 user_id varchar //사용자 아이디 name varchar //사용자 이름 status varchar //사용자 상태 created_at timestamp modified_at ti.. 더보기
반응형 관련 책갈피 https://nykim.work/84 반응형 웹 뚝딱 만들기 (1) - 뷰포트 메타태그와 미디어 쿼리 이 글은 공동 기술 블로그(tech.yeon.me)에도 올린 글입니다. (여기에서도 숨겨진 좋은 글을 발견할지도 몰라요!) 프롤로그 모바일 사용자가 점점 늘어나는 요즘 반응형으로 만든 웹 사이트를 쉽게 nykim.work https://nykim.work/85 반응형 웹 뚝딱 만들기 (2) - vw, vh, vmin, vmax, em, rem 속성 프롤로그 지난 글에는 반응형을 위해 필요한 뷰포트 메타태그와 미디어 쿼리에 대해 다뤘었는데, 이번에는 CSS 속성을 통해 좀 더 편하고 쉽게 반응형을 만드는 방법을 알아보려고 합니다 🤟 히 nykim.work https://velog.io/@cheal3/%E.. 더보기
[색조합] 내맘대로 팔레트 -2 날리게 되어 슬픈 마음에 작성중 labelColor = "#1ab394"; labelColor = "#D9556E"; labelColor = "#FF7D95"; labelColor = "#F5B345"; labelColor = "#6B5A3E"; labelColor = "#B3EB44"; labelColor = "#5C6B3F"; labelColor = "#B369F0"; labelColor = "#5C4D69"; labelColor = "#D97C5F"; labelColor = "#B56750"; labelColor = "#5A8AE8"; labelColor = "#5580D9"; labelColor = "#4F45F5"; labelColor = "#0598E6"; labelColor = "#00000.. 더보기
[JS + HTML] 동적 datalist option 추가 + data-value 로 보이는 것과 다른 값 보내기 1. 동적으로 datalist option을 추가하기 HTML JS var snackData = {}; var snackListOpt = []; //최초 설정 function addSnackOpt(){ //response는 받아온 값 response.forEach(function(res){ //data-value가 보낼 값, value가 보여질 값. var tmpStr = `` snackListOpt.push(tmpStr); }); $('#snackList').append(snackListOpt); $('#snackList option').each(function(i,el){ snackData[$(el).data("value")] = $(el).val(); }); } //실제 전송할 때 function .. 더보기
[색조합] 내맘대로 팔레트 #1 #1. 내맘대로 봄 #a490ff / #ff90d1/ #bcff90 파스텔 톤. 배경으론 적절치 않다. 특히 초록색 배경에 하얀 글자를 넣으면 대체적으로 보이지 않는 편이다. 너무 예쁜 보라색을 발견해서 넣어봤다. #1.5. 내맘대로 봄- 배경 #735bff / #ff5bbb / #a5ff5b 위의 색을 좀 더 찐하게 한 것. 배경으로 적절하지만 프로젝트랑은 안어울려서 기각. 초록색에 하얀 글자가 마찬가지로 잘 안보인다. #2. 국룰 무지개 #ff5e6b / #ff9c40 / #5ce294 / #57abfa / #d690ff 배경으로 쓰기 좋은 원색 뙇 컬러. 하얀 글자 넣어도 잘 보임. 회색은 #e0e0e0, 검정은 #222222 가 어울린다. 노란색 잘쓰기 정말 힘들다.초록색은 배경으로 쓰기 정말 한.. 더보기
[불편 -1] 문자열 자르기: Byte 단위 문자열을 자를 때, 무심코 음절 갯수로 subString으로 자르게 되면 한글 + 영문 혼용의 상황에서, 굉장히 불편한 상황을 마주할 수 있다. 같은 여섯글자일 때, 한글과 영어가 각각 여섯글자입니다 abcde 로 보이는 현상을 마주할 수 있다. 본인은 정해진 넓이의 칸에 글자가 넘치면 자르는 함수를 만드려고 했는데, 글자가 아니라 byte 단위로 잘라야 편안한 UI를 볼 수 있다. (초보 개발자지만 이런 디테일에 신경쓰는 저, 비정상인가요?) 자르는 방법은 아래와 같다. var textEllipsis = function(data, offset){ //data: 자르고자 하는 str, offset: 자르는 byte 길이 dataByteLength = (function(s,b,i,c){ //data의 길이.. 더보기
BOF-1. 환경구축 [보고 있는 책] HACKERSCHOOL HANDBOOK #1 Buffer overflow 왕기초편 실습 환경 구축을 위해 갖춰야 할 것 1. VMPlayer(Vmware Workstation 15 Player로 진행하였다) 2. 책에 있는 링크를 통해 다운받은 BOF_Lecture_Red_Hat_6.2 파일(압축 해제한 상태) 1. VMware를 실행한다. 2. Open a Virtual Machine > ../BOF_Lecture_Red_Hat_6.2 폴더의 Red Hat Linux 6.2.vmx 클릭 3. 실행... 4. 콘솔창.. 뭔가 뜸... *정보. 이 콘솔 창에 갇힌 마우스를 꺼내는 법은 ctrl+Alt이다. 그럼 다음과 같이 ... 잔뜩 깨진 ... 한글들을 마주할 수 있을 것이다. 해결하.. 더보기
[github]-2. 커맨드를 써보자. -나의 현재 상황- git 계정은 있다. (gitlab) project와 repository는 만들 수 있다. (멍청하게도 project와 repository를 동일 개념으로 생각한 탓에 프로젝트가 3개나 된다.) github에 올라온 과제를 해야 한다. 1. Git global setup 내가 복붙, 코딩해야 하는 곳(나는 VMware ubuntu에서 코딩해야 했다.)에서 진행한다. git config --global user.name "{내 유저 네임}" git config --global user.email "{내 이메일}" 두 개를 다 해야 한다. 이렇게 되면 git과 내 코딩 장소가 연결된 것이다. 간혹 여기서 안되는 경우가 있는데, 둘 중 하나가 없거나 틀렸거나 인터넷이 안되면 안된다. 인터넷.. 더보기