본문 바로가기

프론트엔드235

테스트 개요 Unit Test 단위(Unit) 테스트란 데이터(상태), 함수(메소드), 컴포넌트 등의 정의된 프로그램 최소 단위들이 독립적으로 정상 동작하는지 확인하는 방법. -> 프로젝트 파일에서 테스트 툴: Jest, Vue Test Utils E2E Test E2E(End to End) 테스트란 애플리케이션의 처음부터 끝까지의 실제 사용자의 관점에서 사용 흐름을 테스트하는 방법 -> 화면에서 테스트 툴: Cypress 2022. 1. 16.
포트 수정 및 배포 기본 실행 명령을 서버리스방법으로 오픈하도록 변경 package.json 코드 수정 "scripts": { "dev:webpack": "webpack-dev-server --mode development", "dev": "netlify dev", "build": "webpack --mode production", "lint": "eslint --fix --ext .js,.vue" }, netlify.toml 코드 수정 -> 포트및 웹팩으로 실행하는 명령부분 수정 (위에서 선언한 명령어와 맞춰줘야함) # 개발 모드 [dev] framework = "#custom" # 감지할 프로젝트 유형을 지정합니다. 앱 서버 및 'targetPort' 옵션을 실행하는 명령 옵션은 '' command = "npm run .. 2022. 1. 15.
로컬 및 서버의 환경 변수 구성 git 으로 코드를 올렸을 경우 다른 사용자가 중요코드를 확인할수 있는 문제점 발생 그런 문제점을 보완하기 위해서 환경변수로 설정하여 관리한다. 패키지 추가 명령어: npm i -D dotenv-webpack webpack.config.js 파일 코드 추가 const Dotenv = require('dotenv-webpack') new Dotenv() 루트경로에 .env 파일 생성 및 코드 추가 띄어쓰기나 따옴표가 안들어가도록 주의 OMDB_API_KEY=비밀 functions -> movie.js 코드 수정 -> 환경변수 데이터 가져오기 -> 기존 변수 삭제 const axios = require('axios') const OMDB_API_KEY = process.env.OMDB_API_KEY 정상동작.. 2022. 1. 15.
영화 정보 반환 API 만들기 axios 사용방법 사이트 axios/axios: Promise based HTTP client for the browser and node.js (github.com) GitHub - axios/axios: Promise based HTTP client for the browser and node.js Promise based HTTP client for the browser and node.js - GitHub - axios/axios: Promise based HTTP client for the browser and node.js github.com functions -> movie.js 파일 생성 const axios = require('axios') exports.handler = async f.. 2022. 1. 15.
Netlify-CLI 구성 공식문서 URL Netlify CLI Command List Netlify CLI Command List Netlify CLI Command List Welcome to the Netlify CLI! This site provides online access to all help strings in the Netlify CLI. For a more in-depth guide, please see our Getting Started guide on our main docs site. If you have questions, ideas, or would like cli.netlify.com netlify-dev x0 What is Netlify Dev? Watch the introduction (24 min.. 2022. 1. 15.
Netlify Serverless Function 기존 Netlify를 이용하여 웹페이지를 동작하면 개인의 데이터가 보여지는것을 확인할 수 있다. Get방식으로 파라미터가 전부 보여진다. 따라서 Function 설정을 따로 해주어야한다. 공식문서 url: Build functions with JavaScript | Netlify Docs Build functions with JavaScript Netlify builds, deploys, and hosts your frontend. Learn how to get started, find examples, and access documentation for the modern web platform. docs.netlify.com 기존 프로젝트에 폴더 및 파일 생성 1. 루트경로 -> netlify.tom.. 2022. 1. 14.

티스토리툴바