profile
HTML5, CSS3, JavaScript, Typescript, React 프론트엔드 개발자입니다.

[Next.js] Next js 시작하기

※ 실행 후 파일을 열었을 때 해당 에러가 발생한다면Parsing error: Cannot find module 'next/babel'1) 프로젝트 루트경로에 .babelrc 파일을 만들어준 뒤 해당 내용을 입력한다.2) 프로젝트 루트경로에 있는 .eslintrc.js

2022년 9월 29일
·
0개의 댓글
·
post-thumbnail

[TDD] 테스트 주도 개발에 대한 고찰과 실습

테스트 주도 개발(Test-Driven Development, TDD) 들어가기앞서 테스트 주도 개발을 해야하는 이유를 찾아보았다. > [테스트 코드를 먼저 작성해야 하는 이유] 테스트 코드를 먼저 작성하는 개발 방법론은 테스트 주도 개발(Test-Driven De

2022년 8월 13일
·
0개의 댓글
·
post-thumbnail

[GitHub] React 프로젝트 github-pages로 배포하기

1. github 레파지토리 생성 2. 프로젝트 열기 3. 프로젝트 경로에서 git 설정하기 4. package.json 파일 수정 package.json 파일에 1, 2, 3번 추가하기. 5. BrowserRouter basename 설정하기 6. gh-page

2022년 8월 12일
·
0개의 댓글
·
post-thumbnail

[React-Native] React-Native 시작하기

React-Native 설치 react-native & react-native-cli 전역 설치 ios 개발에 사용되는 의존성 관리자 cocoapods 설치 react-native 프로젝트 생성 타입스크립트로 프로젝트를 생성했을 때 Parsing error: F

2022년 7월 31일
·
0개의 댓글
·
post-thumbnail

[React] Redux 설정하기

redux : 상태 업데이트와 관련된 로직을 효율적으로 관리하는 라이브러리.react-redux : redux와 react를 연동해주는 라이브러리.redux-saga : 비동기 작업을 처리하는데 도와주는 redux 미들웨어.redux-devtools-extension

2022년 5월 4일
·
0개의 댓글
·
post-thumbnail

[React] React 파일/폴더 정리

BeforeAfterpublic/ 폴더 내부의 logo192.png, logo512.png, manifest.json, robots.txt 파일 삭제src/ 폴더 내부의 App.test.js, logo.svg, reportWebVitals.js, setupTests.j

2022년 5월 4일
·
0개의 댓글
·
post-thumbnail

[ReactJS] 전역 상태 관리 도구 Context API

Context API > state를 전역으로 관리해서 props로 내려주지 않아도 어떤 컴포넌트에서든 사용하고 관리가 가능하도록 하는 전역 상태 관리 도구. Context 설정하기 context.js App.js test.js

2022년 3월 31일
·
0개의 댓글
·
post-thumbnail

[ReactJS] React의 Hook 함수

Hook은 React 버전 16.8부터 React 요소로 새로 추가되었습니다. Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있습니다.컴포넌트에서 바뀌는 값 관리하며, 값이 바뀐 것을 감지 후 랜더링해

2022년 3월 22일
·
0개의 댓글
·
post-thumbnail

[ReactJS] 리액트 시작하기

React는 복잡한 사용자 인터페이스를 쉽게 구축하기 위해 페이스북에서 만든 JavaScript 라이브러리입니다.React는 각각의 독립적인 컴포넌트 단위들을 서로 조립해서 페이지를 만듭니다.JavaScript 라이브러리재사용이 필요한 기능으로 반복적인 코드 작성을 없

2022년 3월 22일
·
0개의 댓글
·
post-thumbnail

[MongoDB] MongoDB와 NodeJS 연동하기

NodeJS 드라이버 모듈MongoDB를 자체 콘솔에서 사용하는 것처럼 명령어를 그대로 사용할 수 있다.mongodb nodejs 연결데이터베이스 연결컬렉션 객체데이터 삽입데이터 수정데이터 삭제데이터 검색

2022년 2월 28일
·
0개의 댓글
·
post-thumbnail

[MongoDB] MongoDB 문법

데이터베이스 확인데이터베이스 생성데이터베이스가 없으면 생성 후 선택, 있으면 선택데이터베이스에 자료가 없을 경우 show dbs에 나타나지 않음데이터베이스 삭제컬렉션 생성컬렉션 확인컬렉션 삭제Document 추가ex) db.member.insert({"userid":"

2022년 2월 26일
·
0개의 댓글
·
post-thumbnail

[MongoDB] MacOS MongoDB 설치 및 설정

MongoDB 공식 홈페이지의 메뉴얼에 따라 Homebrew로 설치할 수 있다.Install MongoDB Community Edition on macOSHomebrew Tap 등록MongoDB 설치MongoDB 버전 확인MongoDB 데이터 저장소 생성MongoDB

2022년 2월 26일
·
0개의 댓글
·
post-thumbnail

[NodeJS] cookie-parser & express-session 모듈

1. cookie-parser 모듈 > 쿠키를 쉽게 설정하고 사용할 수 있게 도와주는 모듈. 익스프레스 객체에 미들웨이로 등록 사용방법 cp() : 일반 쿠키를 사용 cp('암호화하기 위한 문자열') : 암호화된

2022년 2월 26일
·
0개의 댓글
·
post-thumbnail

[NodeJS] express와 함께 쓰는 모듈들

HTTP post put 요청시 request body 에 들어오는 데이터값을 읽을 수 있는 구문으로 파싱함과 동시에 req.body 로 입력해주어 응답 과정에서 요청에 body 프로퍼티를 새로이 쓸 수 있게 해주는 미들웨어.extended 옵션body-parser 미

2022년 2월 13일
·
0개의 댓글
·
post-thumbnail

[NodeJS] Node.js 기초 모듈

node js의 편리하고 다양한 모듈을 사용하기 위해선 package.json을 설치해야합니다. 설치하는 방법은 프로젝트 경로에서 터미널을 열고 를 입력해줍니다. 그럼 아래와 같이 설정을 어떻게 할 것인지에 대해 질문하는 내용이 나오는데 별 다른 설정은 설치 이후에도

2022년 2월 13일
·
0개의 댓글
·
post-thumbnail

[NodeJS] Node.js 시작하기

서버에서 실행되는 자바스립트이며, 백엔드와 프론트엔드가 같은 언어를 사용하는게 장점입니다. Google V8 JavaScript 엔진을 사용하여 코드를 실행하고 기본 모듈이 자바스크립트로 사용됩니다.웹 서버(apache, iis, zeus, ...)와 같은 소프트웨어가

2022년 2월 13일
·
0개의 댓글
·
post-thumbnail

[PHP, MySQL] 로그인 및 회원가입 폼 만들기 - 2

이번 포스팅에선 자바스크립트를 이용한 사용자 입력값 체크(유효성 검사 validation check)에 대해 알아보겠습니다. 회원가입을 진행 시 "아이디를 입력해주세요.", "비밀번호는 6자 이상 20자 이하로 입력해주세요.", "핸드폰 번호 형식이 맞지않습니다.",

2022년 2월 7일
·
0개의 댓글
·
post-thumbnail

[PHP, MySQL] 로그인 및 회원가입 폼 만들기 - 1

로그인 폼을 만드는 여러가지 방법 중에 저는 PHP, MySQL을 사용하여 간단한 로그인 및 회원가입 폼 프로젝트를 진행해 보겠습니다. 이번 프로젝트를 진행하며 DB 연결 및 CRUD를 더 이해할 수 있었습니다. ⭐️ php@8.0, httpd, mysql을 사용하여

2022년 1월 24일
·
1개의 댓글
·
post-thumbnail

[Git] Git 명령어 정리

git 저장소 초기화 (local storage에 git 폴더 생성) git 상태 확인 변경사항 확인 변경된 파일명의 내용을 추가 변경된 내용 모두 추가 add된 모든 내용들을 untracked 상태로 변경 commit(메모) 과 함께 변경내용을 확정 입력

2022년 1월 23일
·
0개의 댓글
·
post-thumbnail

[mysql] MySQL 알아보기

1. MySQL 데이터베이스(DataBase) 여러 사람에 의해 공유되어 사용될 목적으로 통합하여 관리되는 데이터의 집합. 테이블(Table) 데이터를 행과 열로 스키마에 따라 저장할 수 있는 구조. 테이블은 데이터가 아니라 데이터를 집어넣는 공간이다. 스키마(Sc

2022년 1월 23일
·
0개의 댓글
·