전체 글(21)
-
[JavaScript] 자바스크립트 Truthy와 Falsy 쉽게 이해하기!
Truthy & Falsy ? 우리가 언어를 배우고 개발을 하면서 조건의 리턴 값을 반환해줄 때 true와 false는 정말 많이 보았을 것이다. 그런데 Truthy는 무엇이고, Falsy는 대체 무엇일까? 어렵게 생각할 것 없이 Truthy는 자바스크립트에서 true로 인식하는 값, Falsy는 자바스크립트에서 false로 인식하는 값을 나타낸다. 더 이해하기 쉽게 자바스크립트에서 각각 true와 false로 인식하는 값들을 간단히 조건문을 통해 살펴보자. Falsy ( = 'false' 같은 값 ) if (false) { // false } else if (undefined) { // false } else if (null) { // false } else if (0) { // false } else..
2023.09.10 -
[JavaScript] 삼항연산자 사용방법 (조건문)
우리가 가장 많이 사용하는 조건문은 if문이다. 하지만 if문 외에 간단히 조건문을 사용할 수 있는 것이 바로 삼항연산자이다. 예제를 통해서 if문을 삼항연산자로 바꾸어봤을 때의 장점을 살펴보자. name 이라는 변수에 빈 배열을 선언을 해주고, 선언한 name의 배열 길이가 0일 경우와 아닐 경우를 조건으로 예시를 들어보겠다. if 조건문 let name = []; if (name.length === 0) { console.log("배열 안에 데이터가 없습니다.") } else { console.log("배열 안에 데이터가 있습니다.") } // 배열 안에 데이터가 없습니다. ↓ 삼항연산자 let name = []; name.length === 0 ? console.log("배열안에 데이터가 없습니다...
2023.09.05 -
[React] 리액트 설치 및 실행 방법 (Window 환경)
- 리액트 설치 및 실행 방법 - 제목처럼 window 환경에서 리액트 개발환경을 세팅했지만 MAC도 상관없이 해당 내용으로 문제 없이 설치 및 실행이 가능하다. 그리고 나는 phpStorm을 사용했지만 이에 상관없이 VSCode나 기존에 사용하는 에디터로 세팅하면 된다. 1. node.js 설치 https://nodejs.org/ko Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 링크로 들어가서 node.js를 다운로드한다. 버전은 LTS와 현재 버전 중 원하는 버전으로 다운로드하면 되는데 어느 버전을 다운 받든 딱히 상관은 없다. 나는 안정적인 LTS버전으로 다운을 받았다. 다운로드받..
2023.08.16 -
[TS] 타입스크립트(TypeScript)란 무엇일까?
타입스트립트(TypeScript)란? 1. 타입스크립트는 우리가 흔히 알고 있던 자바스크립트(JavaScript)의 슈퍼 셋인 오픈소스 프로그래밍 언어이다. 슈퍼 셋은 언어의 모든 기능을 포함을 함과 동시에 새로운 기능들도 사용가능하도록 자바스크립트를 확장한 상위 개념이라고 보면 된다. 2. 타입스크립트는 자바스크립트에 정적타입을 부여한다. 정적타입을 부여한 타입스크립트의 장점은 타입을 직접 정의함으로써 컴파일 단계에서 오류를 최소한으로 방지하고 빠르게 수정하여 해결할 수 있다. 그리고 타입을 미리 결정하기 때문에 런타임시 타입이 결정되는 자바스크립트보다 실행속도가 빠르다. 3. 타입스크립는 객체지향프로그래밍 지원이 된다. 객체지향의 장점을 사용할 수 있고, 객체지향을 배운 사람들에게는 진입장벽이 수월하..
2023.08.12 -
[React] Props 의미와 사용 방법
Props란? props란 properties의 줄임말로, 상위(부모) 컴포넌트에서 하위(자식) 컴포넌트로 데이터 값을 전달할 때 사용하는 속성이며 이 데이터의 흐름을 "단방향 데이터 흐름" 이라고 표현합니다. Props 사용방법 먼저, 간단히 설명을 하자면 상위 컴포넌트에서는 하위 컴포넌트로 전달할 props 값을 지정하고, 하위 컴포넌트에서는 그 props 값을 받아서 rendering을 합니다. 또한 데이터 수정은 값을 전달하는 상위 컴포넌트만 가능하고, 값을 받는 하위 컴포넌트는 오직 읽기만 가능합니다. App.js (상위 컴포넌트) import React from "react"; import Member from "./Member.js"; function App() { return( Hello!..
2023.08.07 -
[PHP] PHP 문자열 연결 연산자 (간단한 예제)
개발을 하다보면 2개 이상의 문자열을 연결하여 하나의 문자열로 만들어야 하는 경우가 생깁니다. 그 때, 그 역할을 하는 연산자가 바로 .(도트)입니다. 간단하게 핸드폰 번호를 예제로 들어보겠습니다. 이처럼 3개의 변수로 나눈 휴대폰 번호를 문자열 연결 연산자인 .(도트)를 사용해서 하나의 문자열로 만들어 하나의 휴대폰 번호를 만들 수 있다.
2023.08.01