🦁 멋사 12기

🦁 멋사 지원 학교 생활을 하면서 멋사 아이디어톤, 해커톤 등 다양한 경험을 하는 동기들을 보았고 아기사자분들과 같이 공부하고 도움을 주는 운영진이 개인적으로 좋은 성장 환경이 될 것 같아서 프론트엔드 운영진으로 지원을 하게 되었다. 결과는 합격!! 명지대(인문)

기존에 커리큘럼은 다음과 같았다Javascript (1) - 기본 개념과 문법자바스크립트 소개변수와 데이터 타입배열연산자와 표현식조건문과 반복문함수와 스코프, 콜백함수Javascript (2) - 객체 지향 프로그래밍객체와 속성메서드와 프로토타입클래스와 상속모듈화와 네

아기사자분들이 4주 동안 javascript의 개념 및 토이프로젝트를 진행하고 나면 방학에 있는 해커톤 참가를 위해 React 학습을 진행하게 된다. 따라서 프론트엔드 운영진들은 아기사자분들이 공부할 React에 대해서도 미리 공부하고, 커리큘럼을 작성해야했다. 먼저

React.js는 Node.js 기반으로 돌아가므로 Node.js의 개념이 필요웹 브라우저가 아닌 환경에서도 Javascript 코드를 실행시켜주는 자바스크립트의 런타임, 실행 환경즉 Node.js는 Javascript 코드의 구동기구동기란 게임기가 게임을 실행시켜주듯

Meta(Facebook)이 개발한 오픈소스 Javascript 라이브러리대규모 웹 서비스의 UI를 더 편하게 개발하기 위해 만들어진 기술가장 인기있는 프론트엔드에서 사용되는 라이브러리Component : 화면을 구성하는 요소, UI를 구성하는 요소웹 페이지가 Head

React.js 입문 1. React Component Javascript 함수가 html 태그들을 반환하도록 설정할 수 있음 이렇게 html 태그들을 반환하는 함수를 Component Class를 통해서 Component를 만들 수 있지만, 코드의 양이 많아지므로

라이프사이클 1. 라이프사이클? Mount(Like 탄생) 컴포넌트가 탄생하는 순간 화면에 처음 렌더링 되는 순간 Update(Like 변화) 컴포넌트가 다시 렌더링 되는 순간 리렌더링 되는 순간 UnMount(Like 죽음) 컴

구현 화면은 위와 같음Todo 추가/체크/삭제/검색 기능3개의 component로 나눔HeaderEditorListinput 태그는 flex: 1로 둬서 부모의 범위를 넘어가지 않는 선에서 최대로 확장되게 구현서치바는 width: 100%를 줘서 부모에 가득차게 구현서

1. 기능 구현 기능 구현 준비 구현할 기능 Todo 추가/체크/삭제/검색 기능 위 기능을 구현하기 위해서는 todoItem들의 데이터를 State로 만들어서 보관해야 한다. 왜냐하면 새로운 데이터가 추가/수정/삭제되었을 때 화면에 변화를 반영할 수 있기 때문이다

1. useReducer useReducer, useState? useReducer는 component 내부에 새로운 State를 생성하는 React Hook이다. 모든 useState는 useReducer로 대체할 수 있다. useState와의 차이점은 상태 관리

1. useReducer를 통한 refactoring 기존의 상태 관리 함수 onCreate, onUpdate, onDelete를 useReducer를 통해 refactoring 해본다. useState -> useReducer(state, dispatch)로 바꿔주

Optimization Optimization? Optimization이란 웹 서비스의 성능을 개선하는 모든 행위를 일컫는 말이다. 일반적 서버의 응답속도 개선 이미지, 폰트, 코드 파일 등의 정적 파일 로딩 개선 불필요한 네트워크 요청 줄임

React Context는 component간의 데이터를 전달하는 또 다른 방법이다. 기존의 Props가 가지고 있던 단점을 해결할 수 있다. Props는 부모에서 자식으로만 값을 전달할 수 있었다. 만약 위와 같이 계층구조가 두 단계라면, App에서 ChildB로 데

Flutter

Dart 기본 문법

1. UI 작업(위젯) 위젯은 플러터에서 UI를 구성하는 기본 단위이다. 플러터 개발은 위젯을 사용하여 결합하는 방식으로 진행된다. 모든 위젯은 Stateless 위젯, Stateful 위젯 등의 클래스를 상속받은 클래스이기도 하다. 변경될 수 있는 값을 상태(St