전체 글 1017

Web 이나 App 에서 애니메이션을 표시한다면 "Lottie"

Web 사이트에서 애니메이션을 구현하는 경우, 간단한 애니메이션이라면 CSS와 JavaScript로 쉽게 만들 수 있지만, 풍부한 애니메이션을 만들려고 하면 코딩해야 하는 양이 많아집니다. 그럴 때 추천하는 것이 "Lottie "입니다. Lottie는 After Effects 로 제작 한 애니메이션을 쉽게 Web이나 응용 프로그램에서 표시 할 수 있으며, 그 성능이 엄청납니다. 이번 시간에는 Lottie의 특징과 사용의 장점, 사용법 등을 소개하도록 하겠습니다. 목차 Lottie는 Lottie를 사용하는 메리트 구현 코스트가 낮다 여러 플랫폼에 대응 동영상 파일보다 압도적으로 경량 Web 사이트에서 Lottie를 사용하는 방법 준비물 Web 사이트에 표시하는 방법 Lottie를 사용한 애니메이션 샘플 L..

코딩배우기 2020.03.11

[CSS] 상하 또는 좌우에서 가운데 정렬 하는 법

1. 가운데 정렬 text-align : center; 내용의 텍스트와 이미지같은 인라인 요소의 가운데 정렬은 부모가되는 블록 요소에 text-align:center; 를 지정하는 것으로 간단히 지정할 수 있습니다. .parent{ text-align: center; } 2. 가운데 정렬 margin : 0 auto; 1 번과 함께 가장 친숙한 방법으로 부모가 되는 블록 요소에 margin: 0 auto; 를 넣어 줍니다. .parent{ width: 80%; margin: 0 auto; max-width: 500px; } width지정이 필수. % 로 지정하면 반응형 디자인에 대한 대응이 가능합니다. PC 뷰에 최대 폭을 결정하기 위해 max-width을 사용할 수도 있습니다. 3. 상하 좌우 가운데 ..

코딩배우기 2020.03.04

알파 베타 감마 델타가 대체 뭐야? 그리스어 알파벳에 대해 알아보자

알파 베타 감마 델타 오메가 등등 영어 같은데 영 뭔지 모를 이 단어들에 대해서 주변에서 들어 보신적이 있을 것이라 생각됩니다. 이번 포스트에서는 알파 베타 등 그리스어의 알파벳에 대해서 소개하려고 합니다. 목차 알파 베타.. 는 그리스어 알파벳 일상에서 흔히 사용되는 그리스어 알파벳 알파 베타.. 는 그리스어 알파벳 이 이름모를 단어? 들의 정체는 영어의 가까운 친척뻘인 그리스어의 글자 (알파벳) 입니다. 알파에서 시작해서 오메가로 끝나는 그리스어 알파벳의 자세한 내용은 아래와 같습니다. 그리스어 알파벳 표 대문자 소문자 명칭 발음기호 한국어 Α α alpha /'ælfə/ 알파 Β β beta /'bi:tə/ 베타 Γ γ gamma /'gæmə/ 감마 Δ δ delta /'deltə/ 델타 Ε ε e..

영어문법기초 2020.03.03

나누기 영어로 하면? 의외로 모르는 사람이 많은 나눗셈 영어로 말하는 법

나누기 영어로 어떻게 읽고 말할 수 있을까? 예를들어 " 35 나누기 7 은 5 " 를 영어로 말할 수 있으신가요? 35 ÷ 7 = 5 이렇게 수학기호로 표시하면 간단하지만 나누기를 영어로 하라면 의외로 어려워 하는 사람이 많이 있습니다. 그래서 이번 시간에는 나누기를 영어로 말하는 읽는 방법에 대해서 알아보도록 하겠습니다. 목차 1. 나누기 나눗셈 영어명칭 2. 나누기 영어로 말하는 방법 3. 나머지 영어로 4. 분수 영어로 5. 정리 1. 곱하기 / 곱셈의 영어 명칭 먼저 나누기는 영어 이름은 division 이며, 발음 기호는 [dɪvɪʒ(ə)n] 이 됩니다. "Oxford dictionary" 에 따르면 division 은 the process of dividing one number by ano..

영어문법기초 2020.03.03

곱하기 영어로 뭘까? 의외로 모르는 사람이 많은 곱셈을 영어로 말하는 법

많이 쓰는 "곱하기" 영어로 어떻게 읽고 말하나? 좀 갑작스럽지만 6 곱하기 5 는 30 을 영어로 말할 수 있으신가요? 6x5=30 이렇게 수학기호로 표시하면 간단하지만 곱하기를 영어로 하라면 의외로 어려워 하는 사람이 많이 있습니다. 이번 시간에는 영어로 곱하기를 말하는 방법에 대해서 소개를 하도록 하겠습니다. 목차 1. 곱하기 곱셈 영어명칭 2. 곱하기 영어로 말하는 방법 2-1. times 사용하는 방법 2-2. mutiply 사용하는 방법 1. 곱하기 / 곱셈의 영어 명칭 먼저 곱하기를 부르는 영어의 이름은 multiplication 이고 발음 기호로는 [mʌltɪplɪkeɪʃ (ə) n] 입니다. "Oxford dictionary '에 따르면 multiplication 은 "The proces..

비지니스영어 2020.03.03

프런트엔드 트랜드가 한눈에! 2019 년의 가장 핫했던 JavaScript 라이브러리

안녕하세요 탁입니다. GitHub에서 가장 인기있는 라이브러리를 랭킹 표시 해주는 bestofjs.org 라는 사이트가 있는데요. 매년 그 해 가장 핫했던 라이브러리를 발표 하고 있습니다. 선발 기준은 심플해서 당해년에 늘어난 "스타의 수" 입니다. 참고로 2016 년 종합 순위 1 위는 Vue.js 2017 년 종합 순위 1 위는 Vue.js 2018 년 종합 순위 1 위는 Vue.js였습니다.. 이하 2019년 순위, 2019 JavaScript Rising Stars 의 한국어 번역입니다. 프런트엔드를 둘러싼 최신 트랜드를 확인해 보세요. JavaScript 라이징 스타 2019 4 번째 JavaScript 라이징 스타에 오신 것을 환영합니다! 2019 년 GitHub에서 가장 주목을받은 프로젝트를..

코딩배우기 2020.03.02

프런트엔드 대표적인 라이브러리와 탄생이유

알면 신통방통 편리한데 모르면 정말 깜깜한 자바스크립트 라이브러리. 자바스크립트 "라이브러리가 왜 태어 났는지" 를 알면, 해당 라이브러리를 프로젝트에 채용할지 말지를 결정할 수 있지요. 뿐만 아니라, 일부기능만이 필요해서 막연히 사용했던 라이브러리의 다른 기능들도 참조할 수 있겠습니다. 그래서 이 포스트에서는 어떤 기존의 문제가 있었는지 해당 라이브러리가 어떻게 해결해 주었는지 를 정리해 봤습니다. React 기존의 문제 · 요구 어떻게 해결했나 SPA는 데이터 바인딩이 복잡해서 UI구축이 힘들다. 표시 할 내용을 HTML처럼 (JSX에서) 선언으로 쓰며 간단해 졌다. HTML의 표준 기능 컴포넌트를 재사용 할 수없다. 구성 요소 (컴포넌트) 의 재사용을 가능하도록 했다. SPA는 표시 내용을 업데이트..

코딩배우기 2020.02.27

영어 불규칙 동사 정리 - 불규칙 동사표

이 포스트는 영어 불규칙 동사를 표로 정리해 두었습니다. 불규칙 동사는 네가지로 나뉘어 있는데 다음과 같습니다. 목차 1. aaa 형 원형-과거-과거분사의 형태가 같음 2. aba 형 원형과 과거분사의 형태가 같음 3. abb 형 과거와 과거분사의 형태가 같음 4. abc 형 모두 형태가 다름 1. aaa 형 번호 동사(원형-과거-과거분사) 의미 1 beat-beat-beat 때리다. 치다(=hit) 2 bet-bet-bet (돈을)걸다. 3 burst-burst-burst 터뜨리다. (갑자기) 하다. 4 cast-cast-cast 던지다. 5 cost-cost-cost (금액이)들다. 희생시키다. 6 forecast-forecast-forecast 예고(예언)하다. 7 hit-hit-hit 때리다. 8..

영어문법기초 2020.02.26

지각동사 란? 일람표와 함께 수동태 변환등의 사용법을 알아보자

이번에는 영어 지각 동사 에 대해 설명합니다. 지각 동사 는 시험 문법 문제와 대화 문제에 자주 등장하는 중요한 동사입니다! 지각 동사란? 그리고 지각 동사에는 어떤 종류가 있는지 그런 의문을 가지고 계신 분을 위한 포스트이며, 지각 동사의 의미에서 사용 수동태 변환까지 문법이 약한 사람도 이해할 수 있도록 되도록 쉽게 설명하도록 하겠습니다. 목차 1. 영어 지각 동사란? 2. 영어 지각 동사 목록 3. 지각 동사의 사용법 ① (원형 부정사의 경우) 4. 지각 동사의 사용법 ② (ing의 경우) 5. 지각 동사의 사용법 ③ (과거 분사의 경우) 6. 지각 동사의 수동태 변환 7. 정리 1. 영어 지각 동사란? "지각" 이라고 하면 시간이 늦다라는 건가라고 생각하는 분도 계시겠지만, 한자로 보면 知覚 즉 ..

영어문법기초 2020.02.26

[부정사] 사역 동사와 지각 동사에는 어떤 것이 있는가?

사역 동사와 지각 동사에는 어떤 것이 있는가? 사역 동사와 지각 동사에 대해 가르쳐주세요라는 질문을 자주 보는데요. 이번 시간에는 사역 동사와 지각 동사는 각각 어떤 동사가 있는지 알아보도록 하겠습니다. 1. 사역동사 make, have, let 사역 동사는 '(~에게) ...시키다' 라는 뜻을 가진 동사로 make, have, let 이 있습니다. 예) My mother made me clean the room. "어머니는 내 방을 청소시켰다" 위의 사역 동사로 3 개의 동사를 들었 습니다만, 그 밖에도 도움을 청하는 help 를 사역동사로 보는 경우도 있으며, 쓰는 방법은 조금 다르지만 내용이 비슷한 get 도 있습니다. 이들을 포함시켜 강제력 순으로 보면 make > have (get) > let ..

영어문법기초 2020.02.26

현재 완료 형 (have + 과거 분사) 이란? 현재 완료형 용법 3가지

이번 시간에는 시제중 중요한 개념인 현재완료에 대해서 알아보도록 하겠습니다. 이 포스트는 "현재 완료 형이 뭐지?" 라는 하는 분들을 위해 설명 합니다. 중요한 개념이기 때문에 누구나 읽고 현재 완료 형의 의미와 할 수 있도록 되도록 쉽게 설명하도록 하겠습니다. 목차 1. 현재완료형이란 2. 계속 "(계속) ~하고있다" 3. 경험 "~ 한 적이있다" 4. 완료 · 결과 "(그냥, 이미) ~했다" 1. 현재완료형 이란 영어의 시제중 하나인 현재완료형은 have + 과거 분사 로 표시되며, 과거의 어느 시점에서 현재까지를 의미합니다. 구체적으로는 다음의 3 가지 의미중 하나를 나타냅니다. 현재 완료 형의 3 가지 용법 ① 계속 "(계속) ~하고있다" ② 경험 "~ 한 적이있다" ③ 완료 · 결과 "(그냥, ..

영어문법기초 2020.02.26

사역 동사 make have let + get 의 의미와 구분

이번 시간에는 영어의 사역 동사에 대해 알기 쉽게 설명하도록 하겠습니다. 이 포스트의 목적은 사역 동사 란 무엇인가 , 사역 동사 make have let + get 을 어떻게 구분하는지 이해하는 것입니다. 사역동사는 영어의 기본이며 중요한 내용입니다. 누구나 이해할 수 있도록 되도록 쉽게 사역 동사를 마스터 할 수 있도록 알기 해설하도록 하겠습니다 사역동사 목차 1. 사역 동사 란? 2. 사역 동사 have 사용 2-1. 동사의 원형과 사용 2-2. 동사의 과거분사와 사용 3. 사역 동사 make의 사용법 4. 사역 동사 get 사용 5. 사역 동사 let 사용 6. 사역 동사의 구분 정리 1. 사역 동사란? 사역이라는 단어를 한자로 보면 "使役" 으로 사람을 부리어 일을 시키는 것을 의미하는데요. 따..

영어문법기초 2020.02.26

TO부정사 기초 1 - 문법과 연습문제

이번시간엔 부정사에 대해서 알아보도록 하겠습니다. 먼저 부정사라는 명칭을 알아보기 위해서 한자로 써보면 不定詞 인데요. 곰곰히 보면 정해지지 않은 품사라는 것을 알 수 있습니다. 그래서 영어로도 infinitive 라고 하죠. 그럼 아래서 예를 보며 알아보도록 해요. to 부정사 목차 to 부정사란 명사적 용법 형용사적 용법 부사적 용법 (목적) 부사적 용법 (원인) 연습문제 1. to 부정사란 to 부정사의 의미를 알아보기 위해 한자로 적어보면 不定詞 가 되는데요. 한자 그대로 품사(역할)가 한정되어 있지 않은 품사인데요. 역할이 한정되어 있지 않으니 명사로도 형용사로도 부사로도 사용할 수 있는 품사입니다. 형태: to + 동사 원형 모양 동사에 to가 붙는 것으로, 문장에서 명사 나 부사, 형용사 등..

영어문법기초 2020.02.26

Mac에서 대용량 폴더를 du 명령으로 확인하는 방법

du 명령을 사용하여 Mac의 5GB 이상의 폴더를 확인 하드 디스크의 용량이 모자랄 때 터미널에서 아래와 같이 입력하면 5기가 이상의 폴더를 확인할 수 있습니다. sudo du -g -x -d 5 / | awk '$ 1 > = 5 { print } ' 위의 명령은 루트에서 5 계층 아래까지의 폴더의 용량을 확인하고 용량이 5GB 이상의 폴더가 나열되는 (출력 결과의 숫자는 각 폴더의 용량 (단위 : GB)) 명령입니다. 모두 나열하는 데 시간이 걸리기 때문에 프롬프트 (예 : username-macbook : ~ username $)가 나오고 다음 명령을 입력 할 수있는 상태가 될 때까지 기다립니다. # 마지막으로 나열되는 폴더 이름이 / 만의 항목은 파일 용량의 합계임 du 명령 디스크 용량을 조사하..

맥북 2020.02.25

자주 사용하는 정규 표현식을 정리해 봤습니다.

제목대로 자주 사용하는 정규 표현식을 매번 검색해서 사용하는 것은 효율적으로 나쁘기 때문에 정리해 보았습니다. 각 언어에서 정규 표현식의 샘플도 참고해 주세요. 정규 표현식 Email 주소 ^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$ 도메인 이름 ^[a-zA-Z0-9][a-zA-Z0-9-]{1,61}[a-zA-Z0-9]\.[a-zA-Z]{2,}$ 인터넷 URL ^(http|https)://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$ 사용자 이름 (Twitter username) ^[a-zA-Z0-9_\-.]{3,15}$ 유선 전화 ^0\d-\d{4}-\d{4} 휴대 전화 ^(010|019|011)-\d{4}-\d{4} 인터넷 전화 ^070-\d{4}..

코딩배우기 2020.02.24

[비즈니스영어 회화] 현장에서 단골로 사용하는 회화 20선

안녕하세요. 오늘은 제가 20년정도 해외에 살면서, 또 다른 해외에 영업을 해오면서 비즈니스 영어 회화에서 단골로 사용하고 있는 문구를 예문으로 정리해 봤습니다. 목차 인사에서 사용할 비즈니스 영어 문구 예문 5 선 -처음 만나는 사람에 대한 영어 인사 -한 번 만난 적이있는 사람에 대한 영어 인사 자기 소개에서 사용할 수있는 비즈니스 영어 문구 예문 5 선 동의 / 난색을 전하기위한 사용할 엄선 영어 문구 예문 5 선 -상대의 의견에 찬성 동의하는 영어 문구 예문 -상대의 의견에 반대하는 영어 문구 예문 작별 인사에서 사용할 엄선 영어 문구 예문 5 선 1. 만났을 때 쓰는 비즈니스 영어 문구 예문 5 선 인사는 대화의 물꼬를 터 주지요? 나이스투 미츄 말고도 다음 5 가지 정도를 기억해 두면 유용히 ..

비지니스영어 2020.02.24

천자문순서와 의미

천자문 순서와 의미에 대해서 알아보도록 하겠습니다. 천자문은 4자씩 이루어진 고시 250구로, 정확히 천자로 이루어져 있습니다. 글자가 하나도 겹치지 않고 비교적 많이 쓰이는 한자로 이루어져 있기 때문에 한자의 입문용으로 좋은 교재라고 할 수 있습니다. 목록 1. 천자문 순서 (의미와 함께) 2. 천자문 순서 (한자) 3. 천자문 순서 (음독) 1. 천자문 순서 (의미와 함께) 天(하늘 천) 地(땅 지) 玄(검을 현) 黃(누를 황) 하늘은 위에 있어 그 빛이 검고 땅은 아래 있어서 그 빛이 누르다. 宇(집 우) 宙(집 주) 洪(넓을 홍) 荒(거칠 황) 하늘과 땅 사이는 넓고 커서 끝이 없다. 즉 세상의 넓음을 말한다. 日(날 일) 月(달 월) 盈(찰 영) 仄(기울 측) 해는 서쪽으로 기울고 달도 차면 점..

유익한 정보 2020.02.22

React Native 서랍 네비게이터 넓이 바꾸기

리액트 네이티브에서 아래와 같은 방법으로 서랍 네비게이터의(Drawer Navigator)넓이를 바꿀 수 있습니다. 필요한 것 서랍네이게이션 import { Dimention } from "react-native" 넓이를 지정하는 방법 drawerWidth: Dimensions.get('window').width - 200, 장소 const RootDrawerNavigator = createDrawerNavigator({ Home: HomeStack, Reset: ResetScore, }, { contentComponent: MyHeader, initialRouteName: 'Home', drawerWidth: Dimensions.get('window').width - 200, }, );

코딩배우기 2020.02.21

React Native 텍스트 줄바꾸기 3가지 방법

리액트 네이티브에서 아래와 같은 방법으로 줄바꾸기(개행) 를 할 수 있습니다. 참고해 주세요. 방법 3 가지 템플릿 리터럴을 사용한다 {\n}로 둘러싼다 구성 요소를 분리한다 1. 템플릿 리터럴을 사용하는 방법 { ` 첫째 줄 두 번째 줄 ` } 2. {\n} 로 둘러싼는 방법 첫 줄 { "\ n"} 두 번째 줄 3. 구성 요소를 분리하는 방법 첫 줄 두 번째 줄

코딩배우기 2020.02.21

32비트 64비트 차이한번 알아볼까요?

"32비트 64비트" 들어만 본 적이 있는 여러분 안녕하세요. 뭔가 64bit 쪽이 고성능이라는 것은 알겠는데, 그 의미를 이해하고 있는 사람은 의외로 적은것 같아서 이번에는 뭐가 어떻게 고성능인지 알아봤습니다. (사실 내가 알고 싶었습니다) 1. 도대체 bit 란게 뭐야?? "bit" 는 "binary digit" 의 약자로 컴퓨터의 처리 정보의 최소 단위입니다. 바이너리는 2진수를 뜻하고 디짓은 자리수 라는 의미입니다. 컴퓨터는 0 또는 1의 나열로 일을 처리합니다. 컴퓨터는 결국 비트의 나열로 모든 것을 표현하게 되는 것이죠. 1bit는 반드시 0 또는 1의 상태를 유지하고, 그 이외의 값은 갖지 않습니다 . 0 또는 1로 수를 표현하는 것을 뭐라 하지요? 그렇습니다. 2진수입니다. 이진수는 사람에..

IT 인터넷 2020.02.20

아무도 가르처 주지 않는 파워블로거 되는법

파워블로거가 되기위한 비결은 대체 뭘까요? 블로거는 블로그를 운영하는 사람이죠. 그리고 파워블로거는 글자 그대로 '힘쎈' 블로그의 운영자로, 많은 사람들에게 읽히고 있는 영향력있는 블로그를 운영하는 사람을 의미합니다. 이 글에서는 그 중에서도 블로그로 돈을 벌고 일정한 수입이 있는 사람을 "파워블로거" 라고 부르도록 하겠습니다. 그럼 지금부터 블로그를 시작하려고 생각하는 당신에게 파워블로거가 될 때까지 흐름과 파워블로거가되기위한 비결을 소개하고 싶습니다. 파워블로거가 될 때까지 과정 먼저 과정에 대해서 말해 보겠습니다. 파워블로거가 되기까지의 여정은 간단합니다. 먼저 블로그를 시작하고, 다음은 블로그를 업데이트하며, 광고등을 붙여서 수익을 었는 것입니다. 간단하죠? "실제로" 단지 이것뿐입니다. 그럼 조..

블로그 2020.01.18

영어권 프로그램 관련 무료 사이트 정리 (수시 업데이트)

새로운 언어나 기술이 나오거나, 래퍼런스를 검색하다 보면, 영어 사이트를 방문하게 되는 경우가 많습니다. 한국어보다는 영어로 된 래퍼런스가 풍부하고 커뮤니티의 활동이 활발하니, 필연적?으로 영어권 프로그램 사이트를 방문하게 되는 것 같습니다. 프로그램에는 국경이 없지만, 미우나 고우나 태어나 배우는 말에는 바운더리 존재하는 것 같네요. 관련해서 이번 시간에서는 알아두면 요긴한 영어권의 프로그램관련 사이트를 정리해 봤습니다. 도움이 되셨으면 좋겠고, 추천하고 싶은 사이트가 있으시면 업데이트를 위해 댓글로 남겨 주시면 감사하겠습니다. Levels.fyi 해외 기업에서 프로그래머들이 받는 월급 시세를 알 수 있는 사이트입니다. Google이나, Amazon, Facebook 등 유명한 대기업의 연봉을 한 눈에..

코딩배우기 2020.01.16

[번역] github 에서 자주 쓰이는 영어 정리해 봤습니다.

코딩을 하다보면 아무래도 쓸 수 밖에 없는 "github" 그리고 "영어". 이번 시간에는 github에서 실제로 자주 사용되는 영어를 예를 들어 소개합니다. 분석 한 데이터 github에서 1 만 스타 이상을 획득하고있는 169 저장소 커밋 메시지를 대상으로했습니다. bootstrap, jquery, react, d3, docker, node, tensorflow 등 유명한 프로젝트 얼마되지 않아, 좋은 코멘트를 기대할 수 있습니다. 분석 커밋 메시지는 총 134 만 8703 행 이 되기도 했습니다. 그러면 세계의 일류 엔지니어들은 어떤 댓글을 쓰고 있는지 알아보도록 하죠. 빈출 동사 TOP20 순위 단어 의미 1 fix / fixed / fixes 수정 2 add / added 추가 3 remove ..

코딩배우기 2020.01.14

A판 종이 사이즈 A0, A1, A2, A3, A4, A5, A6, A7 용지 크기 (미리 픽셀)

인쇄 종이는 다양한 크기가 있습니다. 따라서 제작물에 적합한 크기를 알아야하는 것이 중요합니다. 이번에는 인쇄 용지로 일반적인 A 용지 사이즈에 대해 소개하고, 각 사이즈의 대략적인 사용 용도에 대해서 소개하도록 하겠습니다. [관련 정보] - B판 인쇄물 사이즈 (mm 픽셀) B4 사이즈 B5 사이즈 등등 B판 인쇄물 사이즈 (mm 픽셀) B4 사이즈 B5 사이즈 등등 현재 가장 친숙하게 사용되고 있는 종이의 사이즈의 주류는, A4판과 B5판이라 할 수 있습니다. PC의 프린터등에서 일반적으로 사용되고 있는 종이의 사이즈가 A4 사이즈 이며, 노트등에 쓰이는 사 tagilog.tistory.com 목차 1. 국제표준 A판 종이 사이즈 2. 용지 사이즈 각각의 크기 -밀리미터, 인치사이즈 -픽셀사이즈 3...

유익한 정보 2020.01.14

React 의 State와 Props 차이와 사용법에 대하여

리액트에서 가장 중요한 요소들인 State와 Props의 차이와 구분에 대해서 적었습니다. State 와 Props React에서 구성 요소가 데이터를 받거나 처리하고 보내기 위해 주요하게 사용하는 것이 바로 State 와 Props 있니다. 적어보니 프론트엔드에서 가장중요하다고 해도 과언이 아닌것 같은 기능이네요. 이 두 개념의 차이를 아는 것은 React를 효율적으로 이용하기 위해 도움이 될 것이라고 생각합니다. State : 구성 요소가 있는 상태 Props : 부모 구성 요소로부터 전달된 속성 State (상태) mutable data (가변 데이터) maintained by component (구성 요소에 의해 유지) can change it (변경 가능) should be considered ..

코딩배우기 2020.01.05

[코딩배우기] var / let / const 비교 차이

Variables declared with the let statement, constants declared with const will be block-scoped. 전역 최상위에 변수와 함수를 놓으면, 어디서나 액세스 할 수있는 전역이 됩니다. 다른 JS 파일에 썼다고해도, 마찬가지로 글로벌스코프(전역) 취급됩니다. 함수 범위 function 안에 쓰여진 변수 · 함수는 내부에서만 변경 참조 할 수 있습니다. 외부에서 참조 할 수 없으므로 변경에 강한 모듈을 만들수 있습니다. var Rollup 어디서나 선언 가능 JavaScript는 함수내 어디서나 var 선언을 쓸 수 있습니다. 함수의 어디에서 선언해도, 선두에 정의 된 것으로 간주합니다. 시작 부분에서 사용하고 싶은 변수는 모두 정의하는 것이..

코딩배우기 2019.12.31

프런트엔드 마스터가되고 싶다면 만들어야 할 프로젝트 9선

다음은 Simon Holdorf ( dev.to / Twitter / GitHub )에 의한 기사, 9 Projects you can do to become a Frontend Master in 2020 의 한국어 번역입니다. 9 Projects you can do to become a Frontend Master in 2020 Introduction 당신이 프로그래밍 초보자이거나 이미 경험이 풍부한 개발자이거나에 관계없이, IT 업계의 급속한 변화를 따라 잡기 위해 새로운 개념과 라이브러리 그리고 프레임 워크에 대한 학습을 계속해야 합니다. 예를 들어 Facebook이 4 년 전에 오픈 소스화 한 React는 이제 전세계의 JavaScript 개발자에게 첫 번째 선택이되고 있습니다. 더해서 Vue와 A..

코딩배우기 2019.12.28

[코딩배우기] 초간단 React.js 입문

이제는 대세인 React.js! 이번 시간에는 리액트에 대해 가능하면 간단히 소개해 보려고 합니다. React.js란 React.js 는 유저인터페이스 (UI) 의 파트를 만들기위한 자바스크립트의 라이브러리이며, Facebook이 만들고 오슨소스로 공개하고 있습니다. React.js가 주목을받는 이유 Facebook 이 만듬 프론트 엔드의 개념을 근본적으로 뒤집음 Virtual DOM (가상 DOM) 컴포넌트 지향 리액티브 프로그래밍 함수형 언어 (프로그래밍) 리액티브 (Reactive) 프로그래밍이란 React의 이름의 유래가되었다고 생각됩니다. 리액티브 프로그래밍은 '반응하는 부분' 과 '인식하는 부분' 를 나누어 생각하고 반응하는 부분에 대해 자동으로 대응하는 개념입니다. React.js의 설명은 ..

코딩배우기 2019.12.25

[코딩배우기] 훌륭한 프로그래머가 되고 싶다면 만들어야할 앱 8 선

이 문서는 Indrek Lasn 씨에 의해 2017 년 12 월에 공개 된 ' The Secret to Being a Top Developer Is Building Things ! Here 's a List of Fun Apps to Build ! "의 번역입니다. 본 기사는 탁이가 원저자의 허가를 직접 얻은 후 기사를 공개하는 것입니다. 전재하면 안됩니다. 저자 Twitter https://twitter.com/lasnindrek 건강에 관한 책을 많이 읽는다고해서 건강해 질 수 있을까요? 실제로 매일 운동을하고 땀을 흘리지 않으면 건강은 손에 쥘 수 없습니다. 코딩 배우기도 역시 마찬가지입니다. 노력없이 훌륭한 프로그래머가 될 수 없습니다. 그래서 이번에는 코딩력을 단련하는 8 개의 멋진 프로젝트를 ..

코딩배우기 2019.12.23

아이폰 갤럭시 장단점 비교

안녕하세요 탁입니다. 이번시간에는 아이폰과 갤럭시 사이에서 무엇을 사야 할지 망설이는 분들을 위해서 아이폰과 갤럭시를 동시에 사용하며 느낀 각각의 장점과 단점 그리고 차이점을 알아보려고 합니다. 목차 1. 가격 및 브랜드 2. 일반적 성능 3. 개별 기능 4. 악세서리 및 수리 1. 가격 및 브랜드 일반적으로 가격은 갤럭시쪽이 저렴 우선 일반적인 가격에 대해 말하자면, 양쪽 모두 휴대폰계의 프리미엄기기이지만, 일반적으로 말하자면 갤럭시쪽이 약간 저렴합니다. 싼 것이 좋은 것이라면 갤럭시의 손을 들어주어야 하겠습니다. 비싸야 맛이다라는 독자에게는 아이폰이 매력이라고 할 수도.. 중고 판매할 땐 아이폰이 유리 하지만 아이폰은 중고로 팔 때 유리합니다. 원래 가격이 높은 데다 오랜 기간 동안 '현역' 으로 사..