본문 바로가기

Category

(80)
Makefile, *** missing separator. Stop. 87: *** missing separator.  Stop. 다음과 같은 에러를 만나면 탭 대신 스페이스 혹은 \n(엔터)가 있는지 확인해보면 된다. 간만에 makefile쓰니 규칙이 전혀 생각나지 않아 한참 헤맸다,,
React, useState와 state useState는 컴포넌트에 state 변수를 추가할 수 있는 React Hook입니다.Referenceimport { useState } from 'react';function MyComponent() { const [age, setAge] = useState(28); const [name, setName] = useState('Taylor'); const [todos, setTodos] = useState(() => createTodos());배열 구조 분해를 사용하여 [something, setSomething]과 같은 state 변수의 이름을 지정하는 것이 규칙입니다.ParameterinitialState: state의 초기 설정값입니다. 어떤 유형의 값이든 지정할 수 있지만 함수에 대해서는..
React, Component란 Component란 어플리케이션의 재사용 가능한 UI들의 결합체.1. Export Componentexport default function Profile() { return ( )}2. Definite Componentfunction Profile() { return ( )}💡 React 컴포넌트는 일반 JavaScript 함수이지만, 이름은 대문자로 시작해야 하며 그렇지 않으면 작동하지 않습니다! 3. 한 파일에서 여러 컴포넌트를 import 하거나 export 하는 방법하나의 파일에 두 개의 default export를 정의할 수 없습니다.이런 경우 새로운 파일 하나를 더 생성해서 default export를 사용하거나named export를 사용하여 한 파일에서 여러 컴포넌..
React, JSX 문법 JSX는 JavaScript를 확장한 문법입니다. JavaScript 파일을 HTML과 비슷하게 마크업을 작성할 수 있도록 해줍니다Web이 더욱 interactive해지면서, 로직이 내용(HTML)을 결정하는 경우가 많아졌습니다. 이것이 바로 React에서 렌더링 로직과 마크업이 같은 위치에 함께 있게 된 이유입니다.  💡 JSX와 React는 서로 다른 별개의 개념입니다. 종종 함께 사용되기도 하지만 독립적으로사용할 수도 있습니다. JSX는 확장된 문법이고, React는 JavaScript 라이브러리입니다. Introducing the New JSX Transform – React BlogThis blog site has been archived. Go to react.dev/blog to see t..
SMTP, IMAP, POP3 STMP (Simple Mail Transfer Protocol)정의인터넷 메일 전송 표준 통신 프로토콜 역할클라이언트와 서버간의 메시지 전달 & 송신 서버와 수신 서버 메시지 전달수신자의 도메인을 example@gmail.com 을 통해 DNS에 MX record를 조회하여 서버간 통신합니다.iMAP &POP3정의클라이언트와 Email Server(SMTP)간 송수신 프로토콜차이 IMAP(Internet Message Access Protocol)POP3 (Post Office Protocol version 3) 다운로드 및 삭제서버 저장소 기반로컬 저장소 기반기기다수의 단말기단일 기기동기화OX서버용량관리 필요 O상대적으로 관리 필요 X보안관리 필요 O상대적으로 관리 필요 X인터넷OX
NodeJS, .env파일 환경변수 사용 Installation Packagenpm i dotenv.env fileENV_VAR=TEXTYOUWANT node filerequire('dotenv').config();console.log(process.env.ENV_VAR);
NodeJS, nodemailer로 API 요청시 메일 보내기 우리가 흔히 회원가입 절차에서 이메일인증을 받을 때 API요청을 통해 수신자의 메일로 서버를 통해 메일을 보냅니다. 오늘은 Nodejs를 통해 이것을 간단히 구현해봅시다.Installationnpm i express nodemailer먼저 express와 nodemailer 패키지를 설치해줍시다. 필요하다면 dotenv 패키지를 설치해서 환경변수를 사용해 사용자의 이메일 주소와 비밀번호를 숨겨줍시다. SMTP Service 이용SMTP 서버는 Gmail 혹은 Outlook 등 다양한 이메일 플랫폼을 활용하면 됩니다. 필자는 gmail을 사용할 것입니다. (Gmail은 무료계정은 하루에 500통, workspace는 2000통까지 가능합니다)자 이제 Gmail 셋팅을 해봅시다!POP3가 아닌 IMAP을 사..
Input Tag가 Click, Focus 되지 않을 때 결론부터 빠르게 말하자면 필자의 경우에는 Bootstrap을 통해 Modal창을 2개 이상 쓰는 경우에 나타나는 현상이었습니다. Bootstrap에서 Multi Modal 창을 지원하지 않기 때문에 일어나는 현상입니다. ModalUse Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.getbootstrap.com그래서 두 개 이상의 Modal 창을 열 때 이전 Modal창을 hide해주는 방법으로 해당 이슈를 해결하였습니다. 이외에 Input Tag가 Focus 되지 않는 이유에는1. z-index로 인한 문제2. disab..