본문 바로가기

전체 글

 (119)
React 스터디 - Redux 리덕스란? Redux는 자바스크립트 애플리케이션을 위한 상태 관리 라이브러리이다. Redux는 Satate를 관리하는 라이브러리이다!! [Redux의 data flow] Action -> (Call the reducer) -> Reducer ->(Update Store) -> Redux Store -> (Render new view) -> React Component ->(Dispatch Synchronous Action) ->다시 Action으로 회귀... *Action: 간단한 자바스크립트 객체이다. 여기에는 우리가 수행하는 작업의 유형을 지정하는 type 속성 있다. 선택적으로 redux 저장소에 일부 데이터를 보내는데 사용되는 payload 속성을 가질 수 도 있다. *Reducer: 애플리케이션..
Git 초기 설정 https://git-scm.com/book/ko/v2/%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0-Git-%EC%B5%9C%EC%B4%88-%EC%84%A4%EC%A0%95 Git - Git 최초 설정 Vim과 Emacs, Notepad++은 꽤 인기 있는 편집기로 개발자들이 즐겨 사용한다. Mac이나 Linux 같은 Unix 시스템, Windows 시스템에서 사용 가능하다. 여기서 소개하는 편집기들이 불편해서 다른 편집기를 사 git-scm.com 1) 사용자 정보 *username과 useremail 설정 git config --global user.name "username" config --global user.email seulgi.baek@dgu.ac.kr *설정 확인 ..
Inflearn 7주차 - Next.js와 TypeScript [SSR vs CSR] 1) Client Side Rendering 서버에서 처리 없이 클라이언트로 보내주기 때문에 JavaScript가 모두 다운로드 완료되고, 실행을 마치기 전까지는 사용자는 빈 화면을 보고 있게 된다. *CSR이 왜 좋은가? SEO 대응에 용이하다. +) SEO 대응에 대한 추가적인 설명 SEO 대응 검색 엔진은 자동화된 로봇인 '크롤러'로 웹 사이트들을 읽는다. CSR은 자바스크립트를 실행시켜 동적으로 컨텐츠가 생성되기 때문에 자바스크립트가 실행 되어야 meatadata가 바뀌었다. (이전 크롤러들은 자바스크립트를 실행시키지 않았었기에 SEO 최적화가 필수적이었다. 구글이 그 트렌드를 바꾸고 있다고 한다.) SSR은 애초에 서버 사이드에서 컴파일되어 클라이언트로 넘어오기 때문에 크..
공개 SW - 백엔드 API 통신 기초개념 정리 *학교 프로젝트 과목을 들으면서 백엔드 API 통신을 처음 해보게 되었다. 까먹었을때 수시로 다시 찾아보기 위해 블로그에 정리해본다! *비동기(Asynchronous) 함수 -function앞에 async를 붙이면 해당 함수는 항상 Promise를 반환 -Promise 아닌 것도 Promise로 감싸 반환 -await: async 함수 안에서만 동작 => javaScript는 await 키워드를 만나면 Promise 처리가 될 때까지 기다린다. -await 함수는 thenable 객체를 받음 -> then method가 있는 호출 가능한 객체(.then/.catch문 사용으로 간편한 예외처리) *CRUD란? 특정 객체에 대한 *Create: 등록 *Read: 조회 *Update: 수정 *Delete: 삭..
백준 - 9012, 9613, 2309 https://github.com/seulgib/Clipper_Baekjoon/tree/main/Baekjoon
Inflearn 6주차 - TDD(테스트주도개발) TDD(Test Driven Development)란? 테스트 주도개발이란, 실제 코드 작성하기 전 테스트코드를 작성하는 단계이다. 테스트 코드 작성 후 해당 테스트 코드를 Pass할 수 있는 실제 코드를 작성한다. 즉, 정리하면 테스트하고자하는 기능의 테스트 코드 작성 -> 테스트실행 Fail -> 테스트 코드에 맞는 실제 코드 작성-> 테스트 실행 Pass 의 순서로 진행된다. 이걸 왜 할까? TDD를 하므로 많은 기능을 테스트하기에 소스 코드에 안정감 부여 디버깅 시간 감소 및 실제 개발 시간 감소 더욱 클린한 코드 작성 React Testing Library란? 구성 요소 작업을 위한 API를 추가해 DOM Testing Library 위에 구축된다. *DOM Testing Library: DOM..
Github Error error: Pulling is not possible because you have unmerged files. hint: Fix them up in the work tree, and then use 'git add/rm ' hint: as appropriate to mark resolution and make a commit. 로컬과 원격이 같은 파일을 수정했을 시 나오는 에러. merge되지 않은 파일이 있어서 pull을 할 수 없다는 뜻이다. 1) git stash 정상적으로 merge를 못한 파일들에 대한 정보를 확인한다. 2) git commit -am "" git commit -am "커밋 내용" git commit --ammend는 직전에 남긴 커밋을 수정하는 지시어다. git pull 해..
CSS에서 사용하는 단위 정리(반응형) [단위] -em: 각 부모의 폰트사이즈를 상속받아 점점 커짐. ex) body{font-size: 10px;} > div{font-size: 1.5em;} > h1{font-size:2em;} -> body의 자식요소가 div라면 10*1.5=15px로 적용, h1이 div의 자식요소라면 15*2=30px로 적용 -rem: 최상위태그에 지정한 것을 기준으로 삼으며, 보통 최상위 태그는 html 최상위태그의 값을 기준으로 상대적 글자크기가 지정되지, em처럼 각 부모요소를 연속적으로 상속받지 x ***반응형*** 이번에 리액트로 웹앱을 개발하면서 꼭 필요했던 단위 뷰포트의 너비값과 높이값에 맞게 사용할 수 있음. -vh: 높이값의 1/100 단위 ex) 브라우저 높이값이 900px이면, 1vh는 그의 1/..

티스토리툴바