DEVELOP
article thumbnail
[ JavaScript ] 프로그래머스 level1 문제 풀이 (1)
CODING TEST/Programmers 2023. 1. 8. 00:01

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 자릿수 더하기 문제 설명 자연수 N이 주어지면, N의 각 자릿수의 합을 구해서 return 하는 solution 함수를 만들어 주세요. 예를들어 N = 123이면 1 + 2 + 3 = 6을 return 하면 됩니다. 제한사항 N의 범위 : 100,000,000 이하의 자연수 ▼ 나의 풀이 function solution(n) { var answer = 0; while (n > 0) { answer += n % 10; n = parseInt(n / 10); } return answer; } ▼ 반복문을 이용하지..

article thumbnail
[ 인프런 - 한입 크기로 잘라 먹는 React] 2. React 기본 - 간단한 일기장 프로젝트 (1)
FRONTEND/React 2023. 1. 3. 17:48

인프런 이정한님의 한입크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 ] 강의 수강 후 강의의 내용을 정리하며 공부한 것을 쓴 게시글입니다. 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com React에서 사용자 입력 처리하기 - DiaryEditor 컴포넌트가 필요한 것 작성자 일기본문 감정 점수 - 작성자, 일기 본문, 감정 점수를 state로 저장하고 변경한다. - 하나의 state로 객체 배열을 관리할 수 있다. - 초..

article thumbnail
[ 인프런 - 한입 크기로 잘라 먹는 React ] 1. React 기초
FRONTEND/React 2022. 12. 30. 02:01

인프런 이정한님의 [ 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 ] 강의 수강 후 강의의 내용을 정리하며 공부한 것을 쓴 게시글입니다. 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 - 인프런 | 강의 개념부터 독특한 프로젝트까지 함께 다뤄보며 자바스크립트와 리액트를 이 강의로 한 번에 끝내요. 학습은 짧게, 응용은 길게 17시간 분량의 All-in-one 강의!, - 강의 소개 | 인프런... www.inflearn.com Why React? React는 Component 기반의 UI 라이브러리이기 때문이다. React는 선언형 프로그래밍 방식이다. React는 Virtual DOM을 사용한다. Create React App # React.js : No..

article thumbnail
[ 생활코딩 Web2 - React ] 컴포넌트, props, 이벤트, state, create, update
FRONTEND/React 2022. 12. 11. 00:25

React # React : 사용자 정의 태그를 만드는 기술 - 자바스크립트의 라이브러리 - 사용자 정의 인터페이스를 만들기 위해 사용 - https://ko.reactjs.org/ React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 A JavaScript library for building user interfaces ko.reactjs.org npx create-react-app my-app cd my-app npm start 컴포넌트 # 컴포넌트 : 사용자 정의 태그 - UI를 재사용이 가능한 개별적인 여러 조각으로 나누고 각 조각을 개별적으로 살펴볼 수 있음 - 이름의 시작은 항상 대문자 - 함수 컴포넌트 / 클래스 컴포넌트 - props 객체를 인자로 받고, 화면에 어..

article thumbnail
[ 생활코딩 - WEB2 JavaScript ] 강의 내용 정리
FRONTEND/JavaScript 2022. 12. 8. 00:47

event # event : 브라우저가 알려주는 HTML 요소에 대한 사건의 발생 - 이벤트 이용하여 사용자와 상호작용 가능 - ex) onclick, onchange 버튼 두개로 day/night 모드 전환 버튼 하나로 day/night 모드 전환 - if문 사용

article thumbnail
[ 생활코딩 - Node.js 활용하기] 2. Session
BACKEND/Node.js 2022. 11. 28. 20:49

Session의 개념 - coockie의 문제점 : 보안이 취약 # Session : 사용자 정보를 저장하는 또 다른 방법 - 클라이언트의 컴퓨터에는 오직 사용자의 식별자인 id값만을 저장 - 실제 데이터는 서버의 DB, 메모리 등에 저장 - 서버에 식별자를 전송하면 실제 데이터를 읽어옴 - 보안에 취약한 쿠키를 보완해주는 역할 - 구체적인 값을 저장하는 대신에 고유한 값을 전달 - connect.sid 값을 서버에 전달 - connect.sid 값이 같은 요청들은 같은 사용자의 접근이라고 간주함 - connect.sid 값으로 요청이 들어오면 서버에서 그 요청에 해당하는 count 값을 가져와서 1을 가져와 브라우저에 응답 - 쿠키 값이 사용자의 컴퓨터에 저장되는 것이 아니기 때문에 덜 위험 sessi..

article thumbnail
[ 생활코딩 - Node.js 활용하기] 1. cookie
BACKEND/Node.js 2022. 11. 27. 04:12

cookie의 개념 # cookie : 서버가 사용자의 웹 브라우저에 전송하는 작은 데이터 조각 - 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송 - 쿠키는 두 요청이 동일한 브라우저에서 들어왔는지 아닌지를 판단할 때 주로 사용 - 사용자의 로그인 상태를 유지 가능 접속할 때마다 count 증가하기 # cookie-parser : 요청된 쿠키를 쉽게 추출할 수 있도록 도와주는 미들웨어 ▼ 설치 및 사용방법 cookie-parser Parse HTTP request cookies. Latest version: 1.4.6, last published: a year ago. Start using cookie-parser in your project by ..

article thumbnail
[코드잇 - Node.js 기본기] 2. Node.js 기본 개념 - ② 비동기 프로그래밍
BACKEND/Node.js 2022. 11. 26. 01:18

01. 비동기 프로그래밍과 콜백 # 동기실행 : 하나의 작업이 끝난 후 다른 작업을 실행하는 방식 - readFileSync 함수 # 비동기실행 : 특정 작업이 완료되었을 때 실행할 콜백을 등록해두고 바로 다음 코드로 실행을 넘기는 방식 - 비동기 프로그래밍 Node.js 환경에서 권장됨 - readFile 함수 # 비동기 프로그래밍 - 비동기 함수 사용 / EventEmitter 객체 사용 # readFile 함수 - 비동기 함수 - fs.readFile(path[,options], callback) - path : 내용을 읽을 파일의 경로 (필수적 인자) - options : 파일의 내용을 읽을 때 적용할 옵션 ( 선택적 인자 : 대괄호 안) - callback : 파일의 내용을 다 읽었을 때 실행될..