RestAPI & import 간단 메모
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ Nᴏᴅᴇ.Jꜱ
RestAPI실습 express 자체에선 JSON 데이터를 읽을 능력이 없다 읽게 해줄려면 .use()메서드를 이용한다 💡 주의점 윗쪽에서 부터 읽어오기 때문에 app.use는 최상단에 배치하는 게 좋다 import Javascript 파일간에 Import하는 방법은 여러가지가 있다 연결할때엔 상단에 import구문이 필요하며 자원을 주는 쪽에 파일엔 export 키워드가 앞단에 있어야 가져올 수 있다 전체적으로 불러올 수 있고, 부분만 가져올 수 있다 그리고 default 메서드로 지정하여 따로 자원을 명시하지 않고 import할 경우 해당 메서드가 자동으로 세팅되게 할 수 있다 기본 문법 import 자원이름 from './파일경로' // 요즘 방식 이며 가장 기본방식 import { 자원1, 자원2..
cors , 꼭 알고 가야한다
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ Nᴏᴅᴇ.Jꜱ
CORS sop(same origin policy) : 같은 출발지 정책 브라우저에선 보안적 이슈로 cross-origin http 요청을 제한한다 그래서 cross-origin 요청을 하려면 서버의 동의가 필요하다 만약 서버가 동의한다면 브라우저에서는 요청을 허락하고 동의하지 않는다면 브라우저 에서 막는다(거절) 이러한 동의하는 로직을 HTTP-header를 이용한다 이를 cors(Cross-origin Resource Sharing)이라 부른다 Cross-origin이란? 프로토콜이 다르다 : http와 https는 프로토콜이 다르다 도메인 : domain.com과 other-domain.com은 다르다 포트 번호 : 8080 포트와 3000포트는 다르다 CORS가 필요한 이유 CORS가 없이 모든 ..
express기초-nodemon
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ Nᴏᴅᴇ.Jꜱ
express 사용법 // js 파일 상단에 Import를 먼저 해야함 import express from 'express' // 해당 js파일이 있는 경로로 터미널을 실행한다 yarn init // packag.json 파일이 생성됨 "type" : "module" // 패키지 파일에 해당 내용을 추가하고 저장한다 // yarn을 통해 express 설치 // json파일의 "dependencies" 내용에 설치한 Express 목록이 추가되어야 한다 dependencies란? 설치했던 파일 목록이고 개발 환경의 히스토리이다 만일 nodemoules 파일 삭제시 재설치를 해야하며 재 설치시 yarn install 만 입력하면 처리됨 [주의점] 모든 명령어는 package.json 파일이 있는 폴더에서 ..
디자인, 이게 최선이였냐?! , 불호령 떨어진 디자인 개편
·
👀 Side Project/Eᴍʙᴀᴅ (23.12~24.01)
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ gayulz - Overview 개발자가 되고싶은 개발어린이💟. gayulz has 11 repositories available. Follow their code on GitHub. github.com GitHub - gayulz/EMBAD_project: EMBAD , MY PROJECT EMBAD , MY PROJECT. Contribute to gayulz/EMBAD_project development by creating an account on GitHub. github.com 🙏 양해의 말씀 그동안 포스팅을 잠시 미뤘다. 마지막 프로젝트에 집중하고 싶었고, 이 프로젝트는 이력서에도 포트폴리오에도 첨삭되는 거라 옵시디언에 열심히 중..
회원가입 구현
·
👀 Side Project/Eᴍʙᴀᴅ (23.12~24.01)
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ gayulz - Overview 개발자가 되고싶은 개발어린이💟. gayulz has 11 repositories available. Follow their code on GitHub. github.com GitHub - gayulz/EMBAD_project: EMBAD , MY PROJECT EMBAD , MY PROJECT. Contribute to gayulz/EMBAD_project development by creating an account on GitHub. github.com 🙏 양해의 말씀 그동안 포스팅을 잠시 미뤘다. 마지막 프로젝트에 집중하고 싶었고, 이 프로젝트는 이력서에도 포트폴리오에도 첨삭되는 거라 옵시디언에 열심히 중..
Javascript 서버요청/비동기통신/노드제어
·
👀 Side Project/Eᴍʙᴀᴅ (23.12~24.01)
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ gayulz - Overview 개발자가 되고싶은 개발어린이💟. gayulz has 11 repositories available. Follow their code on GitHub. github.com GitHub - gayulz/EMBAD_project: EMBAD , MY PROJECT EMBAD , MY PROJECT. Contribute to gayulz/EMBAD_project development by creating an account on GitHub. github.com 🙏 양해의 말씀 그동안 포스팅을 잠시 미뤘다. 마지막 프로젝트에 집중하고 싶었고, 이 프로젝트는 이력서에도 포트폴리오에도 첨삭되는 거라 옵시디언에 열심히 중..
2023/12/15 🚧 삐뽀삐뽀 응급상황
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com 응급상황 오늘 오후 과제 제출인데 팀장님이 개인사로 탈주 😥 어쩔 수 없이 남은 둘이서 마저 진행을 해야 하는 데 다른 팀원도 아직 구현중이고 바빴다. 그래서 먼저 끝낸 내가 어찌어찌 메인 화면을 구현하고 연결하는 것 까지 진행하기로 하였다 너무 급하게 하던 프로젝트라 너무 허접해 보일 까봐 첫 화면에 큰 기능이 없더라도 특이해 보이게 하고싶었다. 그래서 유튜브를 뒤져보..
🌱Inflearn🌱 spread연산자,얕은복사 깊은복사
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com spread 연산자 개념 : 하나로 뭉쳐있는 값들의 집합을 전개해주는 연산자 전개란? 값을 펼쳐준다, 배열을 한커플 벗겨주는 행위 작성법 : … 점 세개가 있으면 됨 예제 let arr = [1,2,3,4,5] console.log(arr) // [1,2,3,4,5] console.log(...arr) // 1 2 3 4 5 let str = "hello" console..
🌱Inflearn🌱 프로미스
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com 시작전 이야기 프로미스에 대해 이해하려면 먼저 HTTP를 알아야 한다 HTTP통신시 요청헤드:요청바디/응답헤드:응답바디 가 있다 응답헤드 - status code / credentials : true(쿠키허용) 응답바디 - 요청한 데이터가 있음 관련 링크 🌱Inflearn🌱 동기,비동기 ❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gay..
🌱Inflearn🌱 동기,비동기
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com 동기통신 데이터 통신을 위한 '요청’을 하였을 때, 어떠한 요청에 대한 '응답’을 받을 때 까지 기다리다 완료된 다음 코드가 수행되는 처리방식 브라우저 동기통신 권장되지 않는 방식이다, 동기 통신은 브라우저 실행을 일시 중지 후 사용자 인터페이스를 블로킹하는 문제를 야기할 수 있다 따라서 비동기 방법으로 서버통신 하는 것이 더 좋다 비동기 통신 데이터 통신을 위해 '요청..
🌱Inflearn🌱 JSON
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com JSON이란 ? JavaScript Object Notation 문자 텍스트형 데이터 포멧이다 개발된 배경 인터넷에서 데이터를 전달할 때 기술이 고도회 되면서 전달하고자 하는 데이터가 너무 많아졌다. 사용자가 데이터 핸들링이 쉽도록 데이터를 전달 할때 담는 형식이 생기기 시작했다 대표적으로 XML , CSV , JSON XML : 값 용량이 증가되며 생긴게 끔찍… CSV..
🌱Infearn🌱 WebStorge
·
👩🏻‍💻 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞/⠀⠀⠀⠀ JᴀᴠᴀSᴄʀɪᴘᴛ
❤ 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ GitHub - gayulz/StudyHistory: 나의 공부 기록 commit 나의 공부 기록 commit . Contribute to gayulz/StudyHistory development by creating an account on GitHub. github.com WebStoryge 브라우저에 데이터를 저장할 수 있는 기술이다 하위개념 공통점 : key-value로 로컬에 저장한다 sesstion storyge : 세션 단위로 구분되어 활용하며 브라우저가 갱신되거나 탭 종료시 영구 삭제된다 local storyge : 도메인 단위로 구분되어 활용, 브라우저나 Pc 종료를 하더라도 남아있다 데이터 존재 여부 확인 truty : fa..
유리쯔의일상
'javascript' 태그의 글 목록
상단으로

티스토리툴바