- 전체보기(56)
- JavaScript(19)
- CodeCamp(19)
- React(14)
- CSS(5)
- html(4)
- 알고리즘(2)
- 백준(2)
- DOM(2)
- 로그인(2)
- routing(2)
- Map(2)
- algorithm(2)
- 백준문제(2)
- 회원가입(2)
- CS(2)
- pagination(2)
- search(1)
- 다중루프(1)
- function(1)
- Function Component(1)
- 유클리드호제법(1)
- Atomic Pattern Folder(1)
- Carousel(1)
- destructuring assignment(1)
- 회고(1)
- component(1)
- Process and thread(1)
- promise(1)
- firestore(1)
- 깊은복사(1)
- API(1)
- FetchMore(1)
- ROM(1)
- header(1)
- POST(1)
- library(1)
- patch(1)
- S3(1)
- 알고리즘 수행시간(1)
- for문(1)
- image(1)
- operator(1)
- 브라우저(1)
- velog(1)
- project(1)
- Class Component(1)
- refetch(1)
- 시간복잡도(1)
- sort함수(1)
- 정렬 알고리즘(1)
- Bulma(1)
- react hook form(1)
- primitive(1)
- 라우팅(1)
- router(1)
- GCP(1)
- Firebase(1)
- 공간복잡도(1)
- await(1)
- useEffect(1)
- useState(1)
- JOIN(1)
- ajax(1)
- 점근표기법(1)
- python(1)
- HDD(1)
- Container/Present Folder(1)
- async(1)
- object_id(1)
- Presenter(1)
- graphql(1)
- 이항계수(1)
- frontend(1)
- layout(1)
- keyframes(1)
- hoisting(1)
- 큐 함수(1)
- 조건문(1)
- 테스트(1)
- JWT(1)
- autofill(1)
- Apollo-graphql(1)
- 클로저(1)
- 얕은복사(1)
- webkit(1)
- global variable(1)
- filter(1)
- 면접 기본(1)
- 빅오메가표기법(1)
- put(1)
- 재귀함수(1)
- BFS(1)
- Slick(1)
- RAM(1)
- Formik(1)
- 파싱(1)
- Event Listner(1)
- hidden(1)
- 무한 스크롤(1)
- Context API(1)
- overflow(1)
- CSR(1)
- SSR(1)
- Promise All(1)
- storage(1)
- nested function(1)
- 정렬(1)
- React Review(1)
- infinite scroll(1)
- Orientation(1)
- 스택(1)
- Fetch(1)
- Naver D2(1)
- yup(1)
- parse()(1)
- Crawling(1)
- github(1)
- 이진탐색(1)
- JSX(1)
- Flask(1)
- 그리디 알고리즘(1)
- rendering(1)
- DFS(1)
- Props(1)
- Token(1)
- 빅오표기법(1)
- Global styles(1)
- 동적계획법(1)
- autocomplete(1)
- ES6(1)
- private_variable(1)
- input vs stdin.readline(1)
- redux(1)
- closure(1)
- session(1)
- container(1)
- git(1)
- typescript(1)
- Infinite Scroller(1)
- 404 에러(1)
컴퓨터의 기본이해 및 Javascript 문법
컴퓨터의 기본동작은 3가지 구성요소로 크게 진행된다.CPU(Central Processing Unit), RAM(Random Access Memory), HDD(하드디스크)CPU: 주 기억장치라고 불리는 RAM에서 코드들을 불러와 연산, 논리, 흐름제어 등을 한다.RA
Javascript 시작
흔히들 말하는 HTML(뼈대) + CSS(뼈대 꾸미기) 그리고 Javascript (행동) 이렇게 세개로 묶일 때 무슨말인지 이해 못했다.공부를 조금 하다보니 이해를 하는 걸 보니 확실히 나 같은 경우는 이론적으로 습득한 이후에 이론 적용을 프로그래밍에 하는 것 보다는
TIL - (1일차)
오랜만에 쓰는 velog...원래는 프로젝트를 하는 기간중에도 자주 써야했지만 프로젝트에 집중하겠다는 변명을 가지고 거의 한달간 velog 작성을 하지 못했다. 그래도 프로젝트에만 집중할 수 있어서 스스로 만족할만한 중고마켓 페이지를 만들긴 했지만 앞으로는 프로젝트를
React| React-Hook-Form & Webkit 자동완성 문제
FE 개발자로써 유효성 검사를 하다보면 되게 수고가 많아지는 경험을 하곤한다. 나도 첫 개인프로젝트를 진행할 때 commons 폴더에 function 하나를 빼놓고 해당 폴더안에서 이메일, 패스워드, 이름, 등 유효성 검사를 early exit 형태로 진행하도록 구현하
TIL React | 회원가입/로그인 -1
오늘은 모든 홈페이지에는 거의 무조건 있다는 회원가입/로그인에 대해서 알아보겠다. 모든 홈페이지에서 회원가입/로그인 기능이 있기 때문에 비전공자 입장에서는 구현이 그리 어렵지 않을 거라 생각했지만....태초마을로 가서 회원가입/로그인의 초기부터 살펴보자.회원가입을 할
TIL React | 검색기능
모든 코드에 의미를 담겠습니다.지금까지 내가 구현한 자유게시판에는 Pagination 기능과 게시물을 등록할 수 있는 기능까지만 올림차순으로 정리해놓고 내용을 클릭하면 등록한 게시판으로 넘어갈 수 있는 구조를 만들어 놓았다.여기서 금일에 추가한 내용은 검색을 하였을 때
.gif)
TIL React | 이미지 처리 - 2
금일은 이미지 처리를 하는데에 아침 점심을 모두 다썼다. 조금 늘었다고 생각을 했지만 이미지 처리 알고리즘 짜면서 밤을 새면서 더 해야겠다는 생각이 들었다.구현 기능 (이미지 처리)이미지 업로드 버튼 박스가 Default 값으로 3개를 게시물 등록페이지에서 보여준다.이
Infinite Scroll & CSR & SSR
모든 코드에 의미를 담겠습니다. 지금 내가 구현하는 기능중에 꽤나 유용했고 알아두면 좋은 기능들을 정리하면서 개발일지에 한번 정리해보려고 한다. 그런것들은 위와 같이 유레카 이미지가 들어가 있고, TIL과는 다른 개발일지로 구분이 될 것 같다. > 오늘의 유레카!
TIL - 이미지 처리과정과 방법
모든 코드에 의미를 담겠습니다.금일은, 이미지를 어떻게 백엔드에 요청을해서 응답을 받아오는 지 한번 알아보자!!현재 내가 사용하고 있는 기술 스택은 next.js(react.js)를 통해 Apollo-graphql을 통해서 백엔드 API와 통신을 해서 데이터를 받아오고
TIL - Layout, Global Styles
모든 코드에 의미를 담겠습니다.오늘은 내가 이해한 바의 LayoutOut, Global Styles에 대해서 이야기 해보겠다. 물론 피드백은 환영.. 제발요...지금까지 내가 개인 실습 프로젝트를 자유게시판을 만들면서 Layout을 사용하지 않았다. Presenter/
TIL -TypeScript 활용
금일은 TypeScript의 활용에 대해서 알아보고자 한다. Typescript는 컴파일러 언어중에 하나로써 나중에 언어를 Javascript로 변환해서 컴퓨터가 읽게끔 합니다.컴파일: 하나의 언어가 다른 언어로 변경되는 작업을 의미한다.트랜스파일: 하나의 언어가 다른
Open API 에서 받아온 이미지로 Carousel(Slider) 만들기
어제와 오늘은 헤더에 Carousel 만드는 작업을 진행해 보았다.화질은 아무래도 Open API를 통해서 랜덤 이미지를 가져오다보니 Object-fit으로 했을 때 화질이 깨질 수 밖에 없었다. 실무에서 Carousel을 만든다면 디자이너에게 딱맞는 이미지 px을 받
TIL - React
모든 코드에 의미를 담겠습니다.오늘은 useEffect()함수에 대해서 배웠다!! React.js 함수형 컴포넌트를 통해서 배우다보니 Class형 컴포넌트에있던 willmount didmount이런 기능들과는 조금 다르기 때문에 확실히 2가지 모두 배우는 것이 좋아 보
Javascript - Closure(클로저)
모든 코드에 의미를 담겠습니다.Javascript에서 중요하다는, 또, 알게모르게 나도 프로젝트에서 쓰고 있었던 Closure(클로저) 함수에 대해서 알아보는 시간이다!!아직은 이론적으로만 배우는 단계라서 실무에서 클로저를 적극적으로 활용해서 어떤 느낌일지... 궁금하
Browser - 브라우저의 렌더링
모든 코드에 의미를 담겠습니다.3일만에 쓰는 velog.... 주말동안 React 부분에서 해야 될 과제들이 산더미처럼 있어서 개인적인 프론트엔드 공부를 할 여유가 없었던 것 같다(이것도 변명인가..? ㅎㅎ..)조만간, 주말동안에 씨름을 했던 TypeScript wit
React- JSX문법
모든 코드에 의미를 담겠습니다.React에서 JSX문법을 정의하기에 앞서서 React는 SPA(single page application) 즉 하나의 url가지고 운영이되는 프레임워크다.React에서 사용하는 JSX문법이란 과연 무엇일까??HTML문법을 자바스크립트 내
React- Next Router vs React Router
모든 코드에 의미를 담겠습니다.Next 프레임워크와 React 프레임워크를 사용하면서 두 가지의 차이점이 무엇인지 궁금했다. 사실, React.js를 많은 스타트업 및 대기업에서 프론트엔드 프레임워크로 사용하고 있는데 Next.js가 React랑 많이 다르면 취업하는데
Javascript - Map vs filter
모든 코드에 의미를 담겠습니다.map은 javascript에서 for문을 대체하여 실무에서 많이 쓰이는 기능이다.배열을 받으면 배열안에 있는 요소들을 한번씩 찾으면서 원하는 return 값을 반환한다.예를 들어보자.여기서 볼점!map안에는 () => {return }
React - HTTP
모든 코드에 의미를 담겠습니다.오늘은 React를 배우면서 HTTP 통신에러 중에 많이 접하는 웹 에러인 HTTP 404 에러에 대해서 조금 정리 해볼까 한다.HTTP 404 에러란?HTTP 404 에러는 페이지 자체는 존재하지만, 클라이언트 쪽에서 API를 통해 서버
TIL - React
오늘은 회사에서 협업을 효율화하기위한 폴더 구조정리에 대해서 알아보았다.현재 실무에서 유용하게 쓰이는 폴더 구조정리는 크게 두가지이다.Container/Present PatternAtomic Pattern이다.Container Present 패턴 같은 경우는 부모/자식