- 전체보기(147)
- TIL(119)
- WeCode(44)
- JavaScript(34)
- deepdive(27)
- React(14)
- CSS(13)
- html(11)
- 코어자바스크립트(6)
- dart(6)
- typescript(5)
- 클린코드 자바스크립트(5)
- codekata(5)
- this(4)
- DOM(4)
- Event(4)
- reactnative(4)
- algorithm(4)
- class(3)
- pagination(2)
- interface(2)
- 실행컨텍스트(2)
- Constructor(2)
- async(2)
- 실전 리액트 프로그래밍(2)
- flutter(2)
- getter(2)
- setter(2)
- inheritance(2)
- display(2)
- git(2)
- position(2)
- refactoring(2)
- List(2)
- datastructure(2)
- westagram(2)
- promise(2)
- 변수(2)
- scope(2)
- semantic(2)
- callback(2)
- 회고록(2)
- http(1)
- DNS(1)
- linux(1)
- Flatlist(1)
- 배포(1)
- 비교연산자(1)
- browser(1)
- image(1)
- lifecycle(1)
- iterable(1)
- generator(1)
- iterator(1)
- validation(1)
- path(1)
- recursion(1)
- navigator(1)
- 도메인(1)
- datatype(1)
- 시간복잡도(1)
- PseudoClass(1)
- array method(1)
- primitive(1)
- reference(1)
- float(1)
- 프로토타입(1)
- text(1)
- 기업협업(1)
- 매개변수(1)
- await(1)
- useState(1)
- ReactHooks(1)
- revert(1)
- defaultProps(1)
- for(1)
- SOLID(1)
- 네트워크(1)
- export(1)
- graphql(1)
- string method(1)
- ip(1)
- webpack(1)
- frontend(1)
- method(1)
- Flexbox(1)
- layout(1)
- 생성자함수(1)
- selector(1)
- 인터넷(1)
- 조건문(1)
- OAuth2.0(1)
- cli(1)
- 반복문(1)
- https(1)
- bundler(1)
- const(1)
- let(1)
- var(1)
- 클로저(1)
- repeat(1)
- 초기설정(1)
- regex(1)
- Algorithum(1)
- 비트 연산자(1)
- combination(1)
- async/await(1)
- String(1)
- key(1)
- Navigator 2.0(1)
- fontawesome(1)
- BFS(1)
- HashTable(1)
- eventhandler(1)
- State(1)
- Sort(1)
- 함수(1)
- arrow function(1)
- Preprocessor(1)
- if문(1)
- Enum(1)
- reset(1)
- 모바일앱(1)
- PseudoElement(1)
- Expo(1)
- 프로젝트 후기(1)
- memory(1)
- boxmodel(1)
- transition(1)
- TypeGuard(1)
- restapi(1)
- data(1)
- 명령어(1)
- Table(1)
- 재귀(1)
- array(1)
- form(1)
- super(1)
- developer tools(1)
- Defer(1)
- github(1)
- render(1)
- JSX(1)
- slice(1)
- babel(1)
- Map(1)
- styled component(1)
- DFS(1)
- template literal(1)
- 프로퍼티어트리뷰트(1)
- Props(1)
- override(1)
- time(1)
- Date(1)
- grid(1)
- backgroundimage(1)
- redux(1)
- closure(1)
- set(1)
- emmet(1)
- gui(1)
- import/export(1)
- LiteralType(1)
- pwa(1)
- 스레드(1)
- permutation(1)
- sop(1)
- function(1)
- 정규표현식(1)
- 프로세스(1)
- object(1)
- 배열(1)
- cors(1)
- component(1)
- variable(1)
- 동기/비동기(1)
- 웹의 동작 원리(1)
- import(1)
- video(1)
- compiler(1)
- dynamic routing(1)
- 전처리기(1)
- Graph(1)
- debugger(1)
- Symbol(1)
- hyperlink(1)
- merge(1)
- rebase(1)
[Wecode] 기업협업 회고록(11/16 ~ 12/10)
모두의 셀러 Partners는 인스타그램 인플루언서 공동 구매 이벤트 생성 및 관리를 위한 Partners 웹페이지입니다. 80% 정도 React로 개발이 완료된 상태에서 프로젝트를 시작하였으며 Frontend 추가 기능 구현 및 Debugging 작업을 마무리하고 A
.png)
[TIL] React Native-Expo CLI
\*React native 학습 목적으로 Expo CLI로 개발 초기 Setting을 진행함 1) expo install: 기본적으로 node가 설치된 상태에서 아래의 명령어를 terminal에 실행하여 설치합니다. window의 경우 powershell, gitba
.png)
[TIL] React-Redux란?
Redux란? 이다. redux를 사용하면 모든 것은 root, 즉 경로로 data 교환이 일어난다. (자신의 state/props가 변경될 때) Redux의 3가지 사용원칙 전체의 상태값은 1개의 JavaScript 객체로 표현돼야 한다. 상탯값은 읽기 전
[Wecode] 2차 프로젝트 후기
원티드랩에서 운영중인 채용 플랫폼 원티드 클론 프로젝트(짧은 기간, 개발에만 집중하기 위해서 디자인/기획 부분만 클론하였습니다.)개발 기간: 2020/11/02 ~ 2020/11/13 (2주)개발 인원› Fontend: 김수연, 김한나, 민지연, 이예린› Backend
.png)
[TIL] React-Styled Components
Styled Components? . 에 가장 각광받는 이다. 설치 명령어: 사용시 장점 Component가 Unmount 되면 css styling이 memory를 차지하지 않아 성능상의 장점이 있다. 자동으로 생성되는 ClassName으로 다른 compone
.png)
[TIL] React-Hook's state
Hook's state? . 는 Class형과 다르게 state가 없는 대신 한다. : 와 로 구성되어 있다. react는 이 2개의 변수를 array 형태로 return 하는데 naming convention은 아래와 같다. 그리고 이 . useState를 사용하
.png)
[TIL] React-Hooks란?
Stateless Functional Components . Class형 대신 JavaScript의 Function와 동일한 형태로 Component를 정의하여 사용할 수 있는데 이를 라고 말한다. 하지만 React Hooks이 Class component를 100
.png)
[TIL] React-Pagination
웹사이트의 리스트 페이지에 흔히 쓰이는 기능으로 해당 페이지 Rendering시, 모든 데이터를 한꺼번에 Backend에 호출해서 가져오는 것이 아니라 limit&offset을 사용하여1) 다음페이지 버튼 클릭시 혹은 2) 스크롤시 일정 위치에 도달시에 추가로 데이터를
.png)
[TIL] React-Dynamic Routing
history: push/replace를 사용하여 다른 경로로 이동 할 수 있다.(ex: 로그인 성공시, 로그인 페이지 › 메인 페이지 이동)location: 현재 경로에 대한 정보(+Url query)를 갖고 있다.(ex: 이전 경로/지금 경로 비교가 필요할 경우,
[Wecode] 1차 프로젝트 후기
소개› 국내 문구 Commerce 사이트 모나미 클론 프로젝트(짧은 기간, 개발에만 집중하기 위해서 디자인/기획 부분만 클론하였습니다.)선정 이유› 디자인 요소가 적절히 들어가 있으면서 쇼핑몰의 기본기능에 충실하여 선정하게 되었다.개발 기간: 2020/10/19 ~ 2
[TIL] - fontAwesome 사용 tip
fontAwesome은 font 속성의 property를 사용할 수 있는 이미지/text 느낌의 아이콘을 무료로 제공해주는 사이트이다. 1차 prj를 하면서 css styling을 정말 많이 경험하고 있고 styling 지옥에 빠져있다. button tag를 사용할
[Wecode] 한 달을 마무리하며...
>> Wecode에 오기 전 나는 회사를 8년째 다니고 있던 평범한 회사원이었다. 처음에는 엔지니어로 입사를 했었고 5년차 때 QA 부서로 이동해서 사내 시스템 운영/관리를 담당하게 되면서 자연스레 개발자와 일을 하게되었다. 간단하게 시스템 사용시 발생하는 문제점을
[Wecode] Westagram project
👊🏻 Westagram 프로젝트 후기 [Project] 기간: 2020.10.07 ~ 2020.10.14 사용 스택: . React . React-Router-Dom . JavaScript . SASS . html/css 목표: . Jav
.png)
[TIL] React-component lifecycle
🙄 Component lifecycle : component를 초기화하고 DOM에 연결할 때 . lifecycle method: constructor(): mounting 구문에서 첫번째로 호출되는 method render(): moun
.png)
[TIL] React-props
🙊 this.props 모든 . component's의 props 객체는 를 가지고 있는데, prop's 하기 위해서는 라는 표현식을 사용해야 한다. props 정보를 React component에 전달하려면 component의 attribute 속성으로
.png)
[Codekata] JavaScript
str 각각의 알파벳을 기준으로 for문을 돌려서 중복되지 않은 제일 긴 단어를 array 형태로 만든다.그 array의 값 중 길이가 제일 긴 단어의 길이를 return하면 풀이 완료! 처음에 for문 작성시 break를 사용하지 않아 infinite loop에 ri
.png)
[Codekata] JavaScript
Question? 사용한 Method ① : 주어진 숫자의 절대값을 반환하며 숫자가 아닌 문자열, 빈 매개변수 등을 받으면 NaN을 반환한다. 빈 문자열이나 빈 배열을 제공하면 0을 반환한다. ②: Number 객체를 나타내는 문자열을 반환한다. ③: St
.png)
[TIL] React-Component
😏 Component React app은 component로 만들어졌다. component는 재사용이 가능한 코드의 묶음 같은것으로 하나의 일을 수행한다. 그리고 그 일은 HTML을 re-rendering 하는 것을 의미한다. : 이 코드는 React라는 이
.png)
[TIL] React-JSX 문법
🙀 Advanced JSX JSX에서는 attribute 속성인 class 대신에 className을 사용한다. self-closing tag를 사용해야 한다. {} 안에 작성된 코드는 JavaScript 문법으로 해석된다. JSX 표현식에 {}를 사용하면 외부
[TIL] React-React란 무엇인가?
🌟 React? 는 Facebook에서 만든 이다. 장점 . 복잡한 업데이트를 다루지만 React에서 만들어진 App은 빠르다. . Code를 밀도있게 작성할 수 있으며, 파일을 재사용할 수 있다. . 확장성이 있어 데이터로 얽힌 프로그램을 수행하는데 최적의