분류 전체보기 (42) 썸네일형 리스트형 1-2. Template Literal(템플릿 리터럴) -Template Literal 기존의 javascript는 문자열을 입력할때 ''(작은따옴표) 또는 ""(큰따옴표)를 사용했다. Template Literal 방식은 ``(백틱)을 사용한다. (`은 ~을 입력할 때 사용하는 key를 shift없이 누르면 입력된다. mac의 경우 키보드에 표시는 ₩로 되어있지만 똑같이 사용할 수 있다. 혹시 `대신 ₩가 입력된다면 shift 대신 option과 함께 입력하면 된다) 사용방법 사용방법은 간단하다 그저 따옴표 대신 백틱을 입력하는 것. const sayYaho = () => `Yaho`; console.log(sayYaho()); // Yaho 문자열 + 변수 그렇다면 문자열과 변수를 병합해야 하는 경우는? ${} 안에 원하는 변수를 입력하면 된다 const.. 1-1. Arrow Function -화살표 함수 (arrow function) 기존의 function() {} 도 그대로 사용 가능함 기존 function의 사용방식을 먼저 확인하고, arrow function의 사용법을 익혀보자 1) 기존 function의 사용방식 function sayHello(name) { return "Hello " + name; } const elena = sayHello("elena"); console.log(elena); // Hello elena function 키워드와 함께 함수를 선언하고 () 안에 파라미터를 입력한다. (파라미터가 없을경우 그냥 ()만 입력) { } 안에 함수에서 실행할 내용을 선언한다. { } 내 return 키워드와 함께 return 값을 선언하지 않으면 출력 결과값은 undefi.. (2) 멍 어쩌다보니 가슴팍에 멍이 생겼다. 생각보다 아프다. 여린살이라 그런지 가만있다가도 쓰리고 팔을 움직일때마다 아프다. 걸을때도 아프다. 특히 운전할때 안전벨트를 매면, 벨트에 딱 닿는 부위라 엄청 아프다. 무심코 건드리면 더 아프다. 근데 몸에 든 멍은 며칠 뒤면 사라진다. 시간이 조금 더 지나면 흔적조차 없어질거다. 마음에 든 멍은 언제 없어질까? 없어 지기는 할까? 사라지는 속도가 다르거나, 사라지지 듯 아픔의 강도도 다른것 같다. 그래서 아픈데 아프지 않다. 아프지 않은데 아프다. 1. React를 공부하기 앞서 필요한 선행지식 1. Arrow Function(ES6, 화살표함수) 2. Template Literals (리터럴) 3. Object Destructuring (객체 비구조화) -- 2021.05.26 추가 4. Spread Operator (스프레드 연산) 5. Classes (클래스, Java 개발자라면 익숙하지만, 함수형 javascript만 다뤄봤다면 익숙치 않을) 6. Array Function - map 7. Array Function - filter 8. Array Function - foreach 리액트는 역시 Javacript 기반이기에 위 나열한 문법들은 모두 javascript의 문법이지 리액트의 문법은 아니다. 다만 리액트에서 많이 사용되는 문법일뿐! 각각의 특징의 대해서는 다음 포스팅부터 차례로.. (1) 퇴사를 지켜보기 오늘 짧은 시간이지만 친하게 지냈던 회사 동료가 퇴사했다. 그 동료분이 입사하고 처음 같이 식사한 자리에서부터 친해지고 싶었는데, 얼마 되지 않아 재택을 하게되어 친해지지 못했었다. 다시 사무실에 출근하면서, 재택동안 차마 물어보지 못했다며 업무 관련한 아주 사소한 질문들을 내게 물었다. (나는 지금 회사에서 개발팀 막내이다) 그 사소한 질문들은 아주 훌륭한 대화의 물꼬가 되어주었고, 그렇게 친해지게 되었다. 또 그러다 같이 일할수 있는 기회가 생겼다. 그 동료분과의 업무에서의 호흡도 참 좋았다. 그런데 우리 회사에 오신지 얼마 되지 않아 퇴사소식을 듣게됐다. 나를 긴장하게 만드는 소식이었다. 그냥 멋졌다. 본인의 커리어에 대해 진지하게 고민하고, 결단을 내리고, 실행에 옮겼다. 굉장히 빠르고, 결단력있.. Hot한 프론트엔드, 그중에 React 프론트엔드 프레임워크, 라이브러리 잘나가는 것들이 있다 근데 난 그중에 React를 한다. 어쩌다 내가 리액트 개발자가 되었나?? 프론트엔드에 왜 관심을 가졌나 나는 Java Spring Jsp를 사용하는 웹 개발자였다. 백엔드, 프론트엔드 이렇다 할 포지션이 없었다. 그렇다고 "풀스택"이라 하기엔 난, 신입에서 주니어로 막 넘어가려는 찰나였다. 개발분야 트렌드에 리액트, 앵귤러, 뷰 등 프론트엔드의 라이브러리나 프레임워크가 많이 거론되니 궁금했다. 마침 나는 gps를 모니터링 하는, 데이터 리로딩이 상당히 많은 케이스의 페이지를 담당했었다. 그때 누군가 스치듯 말했다. "리액트 같은거 하면 화면 다시 그리면서 로딩에 부하가 발생하는 것에 훨씬 좋을것 같다" 그래서 나는 "그래? 리액트가 뭐길래.. 공부.. [React 클론코딩 기록하기] 계획 남기기 내 블로그는 하루 1명 들어올까말까 하지만! 그래도 나름 공개적인 공간이라고.. 공개적으로 계획을 세워 남기면 어떻게든 지키지 않을까!! 나를 믿지 못하는 나는 이렇게라도 나를 믿어본다...(으잉) 우선! 내가 클론코딩 할 주제는! Nomad Coder에서 제공하는 유료강의 [멤버십] 초보를 위한 React JS! nomadcoders.co/react-for-beginners/lobby Watch Now - 노마드 코더 Nomad Coders nomadcoders.co 자, 계획 세우기에 앞서 내가 이 강의를 무려 유료 결제를 하고 또 이 강의의 챌린지를 신청해가며 클론코딩 하려는 이유를 정리해보자! 나는 원래 Java + Spring 기반으로 웹개발을 하던 뎁린이였다! 그러나 어쩌다 보니 회사의 니즈에.. [AWS] S3 Nodejs 연동하여 외부 api로 파일 업로드하기!! (2) - Nodejs 연동! 흠.. AWS 공식문서의 안내에 따르면 지난번 포스팅에서 생성됐던 엑세스 키의 위치가 아래와 같다고 한다. 그런데 난 해당 경로에 .aws 경로가 없다.. 그래서 아래와 같이 AWS의 안내대로 "인증 자격 증명 받기"를 실행해봤다 보안 자격 증명 탭에서 액세스키 > 액세스 키 만들기 를 진행했다!(그냥 csv파일이 하나 다운받아지는 게 다!) 그런데 사용자 추가시 생성된 csv파일과는 이름이 다릅니다! (나는 현재 이미 진행한 상태라서 그런지 버튼이 비활성화 되어있다) 그래서 이번엔 해당 경로에 credentials 파일이 생겼나 확인해보니 역시나 없다... 알고보니 직접 생성해주나 봅니다..!! 본인 운영체제 해당 경로에 메모장을 열어 아래 내용을 입력하고 본인의 엑세스 키와 보안 엑세스키를 입력! [.. 이전 1 2 3 4 5 6 다음
