분류 전체보기 (351) 썸네일형 리스트형 SPA 기반 사이트 만들어 보기 with. 바닐라 자바스크립트 #2 이제는 콜핵함수를 리턴해주는게 아니라. 각각 path에 따라 엡 페이지를 나타나게 해줄 생각입니다. 우선 해당 웹페이지 컴포넌트를 만들어 봅시다. 추상화 컴포넌트(있는말 아님) c++ virtual처럼 윤곽이 되는 컴포넌트를 만듭니다. ./path/AbstractView.js export default class { constructor(params) { this.params = params; } // 페이지 타이틀 setTitle(title) { document.title = title; } // 뿌려질 Html async getHtml() { return ""; } } ./path/Dashboard.js import AbstractView from "./AbstractView.js"; export d.. C++ 벡터에 대하여.. 오랜만에 C++를 다시보니 까먹은게 너무 많다.. 해서 다른 블로그에 설명이 좋은 것들이 있어서 가져와서 보려고한다. Vector의 초기화 vector 변수명 백터 생성 vector 변수명(숫자) 숫자만큼 백터 생성 후 0으로 초기화 vector 변수명 = { 변수1, 변수2, 변수3... } 백터 생성 후 오른쪽 변수 값으로 초기화 vector 변수명[] = {, } 백터 배열(2차원 백터)선언 및 초기화(열은 고정, 행은 가변) vector 위메이드 코테 후기 잘하지도 못하는 재귀 구현이 필요한 문제에 시간 투자하느라 정작 풀 수 있었던 3번 문제를 풀지 못함.. n x n 크기 좌석을 첫 손님이 0,0 부터 앉고나서 k번째까지 각 앉아 있는 손님의 좌표들이 최대가 되는 거리가 되도록 앉을 때 k번째 앉는 좌표를 구하는 문제였슴... 지금은 풀었는데 불과 30분전에는 풀지못함.. ㅅㅂ... 아까워서 여기라도 올림.. import copy def kprint(arr): for a in arr: print(a) def caculdis(coordis, n): newcoordis = copy.deepcopy(coordis) arr = [[(n * n) + 1] * n for _ in range(n)] for coord in newcoordis: x, y = coord.. SPA 기반 사이트 만들어 보기 with. 바닐라 자바스크립트 #1 바닐라 자바스크립트를 이용하여 spa형태의 웹페이지를 만들어 보려고 한다. 도브라는 유튜브 강의를 참고하여 만들었다. 1. 모든 웹의 근간이 되는 싱글 웹 페이지를 작성한다. 자기소개 http 요청 맛보기 기타 2. 기타 라이브러리 사용을 관리하는 pakage.json 세팅과 경로 지정에 이용할 exprsss 설치 합니다. - npm init -y // npm init 를 할때 생성될때 질문하는 질문에 대해여 모두 yes하겠다는 뜻 - npm install express 3. express.js를 이용하여 서브를 라우팅 할거다. express를 이용하면 url을 통해겨 경로 지정할 수 있다. 이번 페이지 설계에서는 http요쳥을 해서 restapi설계는 하지 않을 거지만 이런식으로 한다는 느낌을 주는 형.. git add . 오류 => Filename too long in Git for Windows Run Git Bash as administrator (right-clicking the app shortcut will show the option to Run as Administrator ) Run the following command: git config --system core.longpaths true Note: if step 2 does not work or gives any error, you can also try running this command: git config --global core.longpaths true 헬퍼 함수란? Helper Function (헬퍼 함수) 다른 함수 안에서 특정 기능을 하고 있는 함수를 헬퍼 함수라고 함 function helper(rows, columns) { return rows * columns; } function general(rows, columns){ return monitorCount(rows, columns) * 200; } const totalCost = general(5, 4); console.log(totalCost); general함수 안에 들어있는 helper라는 함수가 헬퍼 함수임 NextJs Context의 의미 ◎NextJS에서 Data Fectching 하는 방법을 알아보자. NexJS 8 버전에는 getInitialProps를 사용했는데, 현재 9 버전에서는 getStaticProps, getStaticPaths, getServerSideProps를 주로 사용한다. 1. 사전 렌더링(pre-rendering) ◎ NextJS가 작동하는 방식과 이를 빠르게 만드는 데 있어 큰 부분을 차지한다. 기본적으로 NextJS는 실행해야 하는 최소한의 Jacascript와 함께 Hydration를 통해 각 페이지 HTML을 미리 생성하여 모든 페이지를 사전 렌더링 한다. 사전 렌더링에는 정적 생성(SG)과 서버 측 렌더링 (SSR)이 있다. 이 둘의 차이점은 데이터를 가져올 때이다. 1-2. 정적 생성(SG) ◎ SG의.. 프로미스란? Promise가 뭔가요? “A promise is an object that may produce a single value some time in the future” 프로미스는 자바스크립트 비동기 처리에 사용되는 객체입니다. 여기서 자바스크립트의 비동기 처리란 ‘특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성’을 의미합니다. Promise가 왜 필요한가요? 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용합니다. 일반적으로 웹 애플리케이션을 구현할 때 서버에서 데이터를 요청하고 받아오기 위해 아래와 같은 API를 사용합니다. $.get('url 주소/products/1', function(response) { // ... }); 위 API가.. 이전 1 ··· 15 16 17 18 19 20 21 ··· 44 다음