더 알아보기/개념37 S3, ACM, CloudFront, Route53으로 https 배포하기 (with 가비아) 1단계 https://velog.io/@lunaticholic/S3-ACM-CloudFront-Route53%EC%9C%BC%EB%A1%9C-https-%EB%B0%B0%ED%8F%AC%ED%95%98%EA%B8%B0-with-%EA%B0%80%EB%B9%84%EC%95%84-14 S3, ACM, CloudFront, Route53으로 https 배포하기 (with 가비아) [1/4] 아니 어쩌다 보니 개발초짜가 이런글을 쓰고 있는거 실화?하다 보니 이런 저런 실수할 자라나는 새싹개발자들을 위해 이런 글 안남기면 혼날거 같아 쓰는 평범하지만 따라하면 오오!!! 할만한 velog.io 2단계 https://velog.io/@lunaticholic/S3-ACM-CloudFront-Route53%EC%9C%B.. 2022. 1. 7. export와 export default의 차이점 React 문법을 사용하다 보면 모듈을 수출 할 때는 export를 사용하고 사용 방식에는 export, export default가 있고, import를 할 때는 {}를 사용 할 때도 있고 사용하지 않을 때도 있어서 차이점을 정리 해두고 싶었다! 모듈을 내보내고 가져 올 때는 export와 import 지시자를 활용합니다. 차이점 지시어 설명 장점 단점 export {} - named expoert라고 합니다. (ex) import 할 때 무조건 export한 객체 | 함수 이름 - 여러 개의 객체, 함수를 한꺼번에 내보낼 수 있음 내보냈을 떄 사용한 이름 그대로 가져오므로 관련 정보를 파악하기 쉽다. 내보냈을 떄 사용한 이름 그대로 가져오므로 관련 정보를 파악하기 쉽다. export default -.. 2021. 12. 18. 라우터를 이용한 접근 제한 구현 사용자의 로그인 상태나 권한에 따라서 접근 할 수 있는 경로가 다릅니다. 물론 서버 쪽에서 체크를 해주긴 하지만, 해당 URL로 넘어간다는 것 자체를 프론트측에서 막아주는 것이 바람직 합니다. 이를 그림으로 표현하면 아래와 같습니다. 1. 접근 제한 : PrivateRoute는 로그인한 사용자에게 제공되는 루트이고, 만약 로그인 하지 않은 사용자가 해당 루트로 접근한다면 로그인 페이지로 Redirection을 합니다. 반대로, PublicRoute는 로그인 여부와 상관없이 사용자에게 제공되는 루트입니다. 아래 그림과 같이 이미 로그인한 사용자가 해당 루트로 접근하는 것을 막고자 한다면 restricted 옵션을 줘서 제어합니다. 2. 구현 로직 ( Redirection : 방향 지정, 방향 이동 ) - .. 2021. 12. 15. async, await async와 await란? async와 await는 자바스크립트의 비동기 처리 패턴 중 가장 최근에 나온 문법으로써 기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고, 개발자가 읽기 좋은 코드를 작성 할 수 있게 도와줍니다. 개발자가 읽기 좋은 코드란?? : 위에서부터 아래로 한 줄씩 차근히 읽어 나가면서 사고하는 것이 편합니다. 그렇게 프로그래밍을 배웠기 때문이죠! 읽기 좋은 코드와 async, await의 상관성은?? : 아래와 같은 코드를 구성하는 것이 async, await 문법의 목적입니다. var user = fetchUser('domain.com/users/1'); if (user.id === 1) { console.log(user.name); } fetchUser()라는 메.. 2021. 12. 14. axios 개념, Fetch API와의 차이점 (+axios 사용하기) 리액트는 효율적인 UI 구현을 위한 라이브러리 입니다. HTTP Client(HTTP 상에서 커뮤니케이션을 하는 자바 기반 컴포넌트)를 내장하고 있는 Angular와는 다르게, 리액트는 따로 내장 클래스가 존재하지는 않습니다. 따라서 리액트에서 Ajax를 구현하려면 JavaScript 내장 객체인 XMLRequest를 사용하거나, 다른 HTTP Client를 사용해야 합니다. # 짚고 넘어가기 더보기 더보기 Ajax (Asynchronous JavaScript And XML) : Ajax란, JavaScript의 라이브러리 중 하나이며, Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다. 브라우저가 갖고 있는 XMLHttpRequest 객체를 이용해서 .. 2021. 12. 7. HTTP, Cookie, Session, Cache 쿠키와 세션을 사용하는 이유 : HTTP 프로토콜의 특징이자 약점을 보안하기 위해서 사용한다. + HTML랑 CSS는 언어가 아니라 MarkUp Language이다. (깨알 상식) 1. HTTP(Hyper Text Transfer Protocol) 프로토콜의 특징 HTTP의 연결이 끊기면 줬다 뺐는듯한 형태이기 때문에 새로고침을 하지 않는 이상 정보가 바뀌지는 않는다. 1) 비연결성 : HTTP는 클라이언트가 요청(request)을 서버에 보내고, 서버는 클라이언트에게 적절한 응답(response) 주고 연결을 끊는 특성이 있다. 2) 무상태성(상태없음) : 커넥션을 끊는 순간 클라이언트와 서버의 통신이 끝나면 상태 정보는 유지하지 않는 특성이다. HTTP는 이런 두가지 특징을 보안하기 위해서 쿠키와 세.. 2021. 11. 11. 변수 선언 방식 차이 (var/let/const) 변수 선언 방식의 차이점 : var/let/const 자바스크립트의 변수 선언은 var만 가능 해지만, ES6(ES2015)부터는 let과 const가 추가 되었다. 1. var, let, const의 차이점 1) 중복 선언 가능 여부 - var는 중복 선언이 가능하다. : var로 선언한 변수는 중복해서 선언(+초기화)가 가능하다. 이 경우에는 마지막에 할당된 값이 변수에 저장된다. 단, 초기화 없이 선언만 한 경우엔 선언문 자체가 무시되고 에러는 발생하지 않는다. (기존에 선언해둔 변수의 존재를 까먹고, 값을 재할당 하게 되는 실수가 발생하기 쉽다.) - let, const는 중복 선언이 불가능하다. : let과 const로 선언한 변수는 중복 선언이 불가능하다. 이미 선언한 변수를 다시 선언할 경우.. 2021. 11. 9. 호이스팅이란? 호이스팅이란? : 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 말합니다. 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는" 것으로 말하곤 합니다. -> 함수 안에 있는 선언들을 모두 끌어 올려서 해당 함수 유효 범위의 최상단에 선언하는 것 (var, let, const, function, class 등 선언을 하는 애들을 최상단으로 올려서 선언하는 것을 호이스팅이라고 한다.) - 자바스크립트 함수는 실행되기 전에 함수 안에 필요한 변수값들을 모두 모아서 유효 범위의 최상단에 선언한다. 1) 자바스크립트 Parser가 함수 실행 전 해당 함수를 한번 훑는다. 2) 함수 안에 존재하는 변수 / 함수 선언에 대한 정보를 기억하고 있다가 실행 시킨다. 3) .. 2021. 11. 9. 알고리즘이란? 알고리즘이란 : 어떠한 문제를 해결하기 위한 일련의 절차를 공식화한 형태로 표현한 것 ex) 집에서 학교로 가는 길 찾기, 샌드위치 만드는 방법, 매점에 가서 물건 구매하기 등등 프로그래밍에서 알고리즘은 input 값을 통해 output 값을 얻기 위한 계산 과정이고 이러한 문제를 해결 할 때 정확하고 효율적으로 결과값을 얻기 위해서 알고리즘이 필요하다. 프로그래밍을 통해서 어떤 문제를 해결 하려면 기본적으로 다음과 같은 순서로 작업을 하게 된다. 문제의 이해/분석 -> 해결방안 구상(알고리즘 구상) -> 프로그래밍(코딩) -> 실행 및 검증(디버깅) 문제를 이해하고 해결방안을 구상하는 것이라고 할 수 있고, 해결방안 구상이라는 것은 단순히 머리로만 생각하는 것이 아니라 논리적으로 명세화(데이터형의 논리.. 2021. 11. 7. 이전 1 2 3 4 5 다음 728x90
