전체 글 (90) 썸네일형 리스트형 [프로젝트 회고] 피트니스 코칭 GYPPT 프로젝트 소개 시간과 공간에 제약 없이 편리하게 운동과 건강정보를 공유하고 1:1 맞춤코칭으로 전문 트레이너가 개개인의 라이프스타일을 고려하여 맞춤 식단과 운동을 제공하는 서비스를 기획했다. 기술 스택 FRONT-END React Javascript HTML BACK-END Node.js Javascript Express MYSQL MYSQL WorkBench AWS Postman COOPERATION Trello Slack Notion dbdiagram Figma Trello dbdiagram Figma [★] : 내가 담당한 기능 표시 프로젝트 기획 플로우 차트 [★] API 기능 정의서 [★] API 목록 정리 ERD 모델링 핵심 기능 소셜로그인 - 유저 타입 구분 커뮤니티 게시글 [★] - 게시글.. [프로젝트 회고] 스니커즈 리셀 SREAM 프로젝트 소개 한정판을 좋아하는 Z세대들에게 활발한 소비 및 투자로 리셀 스니커즈 시장을 확대하는 서비스를 기획했다. KREAM 사이트를 참고로 리셀이라는 새로운 소비 트렌드를 캐치한 한정판 스니커즈 거래 중개로 단순한 중개에서 벗어나 패션을 즐기는 고객들이 입찰 문화를 통해 소통할 수 있는 플랫폼을 만드는 것이 목적이다. 핵심 기능 회원가입 [★담당] - 비밀번호 암호화, 정규 표현식 로그인 [★담당] - 이메일 중복여부 확인, 토큰 발급 메인페이지 - 정렬, 필터링, 페이징 구현 상세페이지 - 상품 정보 [★담당] - 체결거래, 판매입찰, 구매입찰 데이터 전달 체결 - 입찰과 즉시체결 - 트랜젝션으로 롤백 처리 - 경매 방식 구현 기술 스택 Node.js MYSQL MYSQL WorkBench Pos.. req.params와 req.body의 차이 req.params는 경로 매개변수를 담고 있으며 URL의 일부로 전달되는 데이터이다. 경로에 ":" 를 사용하며 정의된다. req.body 객체로 접근하며 JSON 형태의 데이터나 폼 데이터 등을 포함할 수 있다. req.params 예시 const productService = require('../services/productService') const { catchAsync } = require('../utils/error') const getProductById = catchAsync(async (req, res) => { const productId = +req.params.productId const result = await productService.getProductById(produc.. [MySQL] 윈도우 실행 명령어 + JOIN을 활용한 문제 풀이(westagram) 윈도우 우분투에서 MYSQL 실행리눅스 우분투 관리자 권한으로 실행 sudo service mysql startmysql 접속sudo mysql -u root -pmysql 접속해제exit; JOIN을 활용한 문제 풀이(westagram)문제 'a'라는 사용자가 좋아요를 누른 게시물 중에서 '무엇인가?' 라는 단어가 포함된 게시물만 출력 westagram이라는 데이터베이스 안에 users, posts, likes라는 테이블을 작성해두었다.users : 사용자의 이름posts : 누가 어떤 포스트를 작성 + 포스트의 내용likes : 누가 어떤 포스트에 좋아요를 눌렀는지 문제를 풀기 전 한글로 출력해야할 데이터들을 하나씩 정리해본다.1. column을 나열한다.2. posts 테이블의 작성자 이름을.. [JavaScript] Callback Function|콜백함수 동기,비동기 콜백함수 함수를 전달해서 두 가지의 함수(printYes, printNo)가 if 상황이 맞으면 전달된 함수를 호출한다. 간단히 정의하면 다른 함수에 입력값으로 전달되서 다른 함수에 의해서 호출된다는 것이다. 예제) 정답이면 yes! 정답이 아니면 no! 반환 function quiz(answer, printYes, printNo) { if (answer === 'like it') { printYes(); } else { printNo(); } } const printYes = function() { console.log('yes!'); }; const printNo = function() { console.log('no!'); }; quiz('hate it', printYes, printNo); //n.. [JavaScript] for문을 이용해서 배열로 변환 for문을 이용해서 배열의 형태로 변환할 수 있다. 1. ...(rest parameters) function printAll(...args) { for (let i = 0; i < args.length; i++) { console.log(args[i]); } } printAll('apple', 'banana', 'mango') /* apple banana mango */ 2. for of function printAll(...args) { for (const arg of args) { console.log(arg); } } printAll('apple', 'banana', 'mango') args 모든 값들이 하나씩 차례로 지정되면서 arg를 출력 3. forEach function printAll(... [JavaScript] 논리 연산 logical operators 주의할 점 2023.07.04 - [💻/JS] - [Javascript] 연산자 종류와 if 조건문 [Javascript] 연산자 종류와 if 조건문 if 조건문에 비교 연산자를 사용할 수 있다. 연산자 종류 종류 기호 문법 의미 비교 연산자 == A==B A와 B가 같은가? != A!=B A와 B가 다른가? === A===B A와 B가 일치하는가? !== A!==B A와 B가 일치하지 않는 built.tistory.com 연산자의 종류는 이전글을 참고해주세요 논리 연산(logical operators) 사용시 주의할 점을 정리합니다. || (or) const value1 = false; const value2 = 4 < 2; function check() { for (let i = 0; i < 3; i++) { .. [JavaScript] canvas 자체를 가운데 정렬하는 법(CSS로 가져오기) canvas로 게임 만들기를 하던 중 canvas 자체를 가운데 정렬을 하고 싶어 별의 별의 별의 x100 방법을 시도하다가 성공하였다! 코드가 완벽하진 않지만 일단 구현된 것에 만족한다. JS에 CSS에서 설정한 style을 적용하는 것인데 2번째 방법으로 진행하였다. 1. canvas에 css 적용 2. canvas class에 css 적용 먼저 HTML 요점 코드만 가져왔다. canvas 태그로 JS에서 불러올 id를 설정하고 CSS에서 적용될 class를 부여한다. CSS .background { width: 890px; height: 550px; filter: brightness(80%); background: url(../ghostRain/img/background.PNG) no-repeat .. [JavaScript] for...in vs for...of for in - 객체의 속성들을 반복적으로 열거하는데 사용한다. - 주로 특정 값을 가진 키를 구현할 때 사용한다. - 배열이 아닌 객체의 반복문이므로 일관된 순서로 요소를 방문하지 않을 수 있으니 순서가 중요한 반복문을 구현할 경우 for...of나 forEach()문을 권장한다. for in의 구문 for (const 변수 in 반복할 객체) { 실행문 } - 변수는 반복할 때마다 다른 이름을 지정한다. - 객체는 열거형 속성을 가진 반복을 수행할 객체를 지정한다. ex const obj = {a: 1, b: 2, c: 3} for (const i in obj) { console.log(i + ':' + obj[i]); } /* a:1 b:2 c:3 */ ex. 학점 계산하기 const getExam.. [JavaScript] scope, block 등 용어 정의 scope : 변수에 접근할 수 있는 범위 block : 0개 이상의 구문을 묶을 때 사용하는 한 쌍의 중괄호 global scope : 전역 범위 global variable : 외부에 선언되어도 내부 접근이 가능한 전역 범위에서 선언된 변수(과도하게 사용하면 코드 복잡성과 예상치 못한 결과를 초래할 가능성 높음) block scope : 주어진 코드 블록{} 안에서만 사용 가능한 범위 local variable : function 내에 선언되는 변수 global namespace : 전역 범위에서 이름 공간을 선언하여 구분이 가능하도록 정해놓은 영역 scope pollution : 수가 의도하지 않은 범위에서 접근 가능하거나 사용되는 현상 이전 1 ··· 4 5 6 7 8 9 다음