본문 바로가기

Frontend

 (278)
[TypeScript] 타입스크립트 TypeScript TypeScript는 Microsoft에서 개발한 오픈 소스 프로그래밍 언어 TypeScript 의 장점 1. 실행되기 전에 결정되는 변수 타입 -> 컴파일 시간에 변수 타입을 체크 기존 자바스크립트 코드에서는 덧셈을 결과로 받아야 하는데 다음처럼 문자열이 결과로 나올 수 있다. 타입스크립트에서는 코드를 입력하는 순간 에러 메세지가 생성된다. 이는 컴파일 시간에 오류를 캐치한다. 2. 약한 타입 체크 -> VS Code 에 코드를 입력하는 순간 에러메세지 발생 3. 물렁물렁한 객체 -> VS Code 에 코드를 입력하는 순간 에러메세지 발생 정의 되지 않은 타입을 연산하면 NaN 이 나오는 것을 미연에 방지할 수 있다. 4. 객체지향 프로그래밍(OOP)을 할 때도 자바스크립트보다 훨씬..
[TypeScript] 타입스크립트를 시작하기 전 Node.js 의 잠재적 위험성 프론트엔드의 에러는 뷰의 일관성을 해칠 수는 있으나 전반적인 동작에 영향을 크게 미치지는 않는다. 그러나 예외처리가 제대로 되지않은 백엔드의 단순한 에러 하나로 서버가 다운될 수 있다. 이는 자바스크립트에 기인한 잠재적 위험성이다. JavaScript 의 약점 동적 타입 언어는 버그가 나올 확률이 굉장히 높아진다. 1. 실행시간에 정해지는 변수타입 이에따른 개발자의 실수로 인한 오류가 발생하기 쉽고 찾기도 까다로움. 변수에 잘못된 타입의 값이 할당되어 발생한 오류를 찾기 위해서는 실행시간에 변수의 값과 타입을 모두 확인해야 함. 2. 약한 타입 체크 JavaScript 는 let, const 와 같이 변수/ 상수를 구분하는 정도의 키워드만 지원 된다. 다음과 같은 코드가 ..
[개인 프로젝트] Shaker 개인 프로젝트, 칵테일 레시피 공유 웹 애플리케이션 shaker https://shakers.vercel.app/
WIL 23.07.17 ~ 23.07.24 아웃소싱 프로젝트를 마치며 [아웃소싱 프로젝트 KPT 회고] Keep 활발한 의사소통 편안한 분위기를 만들어 자유로운 의견을 내게 만든 것 오류가 있다면 화면공유하여 같이 해결하는 것 다들 열정을 가지고 더 좋은 프로젝트로 만들기 위해 노력한 것 밀도 있게 집중한 것 프로젝트를 마감시간 안에 잘 끝낸 것 ​ Problem git pull을 했을 때 가끔 연동이 잘 안된 부분 git pull을 했을 때 json-server가 conflict 난 것 ​ Try 화면공유와 구글링을 통해 오류를 해결함 이번 프로젝트에서 새로 시도해본 것 1. 카카오 맵 API 우리 조는 맵이 필수구현과제는 아니었지만, 그래도 맵을 구현해보고 싶은 욕심이 있었다. 그래서 카카오맵을 이용하여 간단하게 구현하였다. 처음에는 하드코딩으로 위도, 경도값을 직접 ..
TIL 23.07.19 카카오맵 API CORS 에러 간단하게 해결 문제점 카카오맵 불러오는데, CORS 뜨면서 차단됐음.. 제일 싫어하고 해결하기 어려운 에러 해결방안 API 자체 오류라고 하길래, 개발자도구 > network > 브라우저 캐시만 지우면 간단하게 해결된다고 해서 지웠더니 해결됨 줌 기능과 스카이뷰 기능, 마커 기능을 추가하니까 제법 지도같이 잘 나온다.
TIL 23.07.18 카카오맵 API 'Geocoder' 에러 문제점 기존에 경도, 위도를 하나하나 입력하여 정보를 받아온 하드코딩 ..에서 벗어나서 단순히 주소만 있으면, 카카오맵에서 객체의 주소를 받아올 수 있다고 하길래, 외부 API인 geocoder를 사용하기로 하였다. 자동으로 위도, 경도로 바꿔주는 API로 경도-위도 검색 사이트를 이용하지 않고 매우 효율적으로 관리할 수 있음. 그러나 이를 사용하는데 에러가 발생하였다. const geocoder = new window.kakao.maps.services.Geocoder(); Cannot read property 'Geocoder' of undefined 오류가 나면서 읽어오지 못했음. 시도해본 것 서비스 종료했나 싶어 검색했는데 그것도 아니었고, Geocorder() -> geocorder() 로 변경..
TIL 23.07.14 오픈웨더맵 날씨 API 불러오기 완성본 현재 습도 99 % ... 오늘은 오픈웨더맵을 이용해서 날씨 API 를 불러오는 방법에 대해 포스팅 하려고 한다. 다음주에 드디어 아웃소싱 프로젝트를 하는데 이게 외부 API 를 사용하는 것과 관련된다고 하길래 다시 복기하고자 함. 모자이크는 내가 사는 지역 이름임. 일단 오픈 웨더 맵을 들어가서 API 키를 얻어온다. https://openweathermap.org/ Сurrent weather and forecast - OpenWeatherMap Access current weather data for any location on Earth including over 200,000 cities! The data is frequently updated based on the global and ..
TIL 23.07.13 json-server glitch 로 vercel 배포 json-server 배포하기 기존 vercel 을 이용하여 배포를 시도하였다. 결과물은 db.json 의 데이터를 전혀받아오지 못함. json-server 를 써서 배포하면, 단순히 배포만 해야하는 것이 아니라 db.json을 담을 그릇(?) 을 만들어주어야 하는데 그게 바로 glitch 이다. 문제점을 해결하기 위해 glitch 에 들어가서 회원가입을 한 후에, 깃허브에서 db.json 을 위한 레포지토리를 하나 생성함. 이분껄 이용해서 레포지토리를 생성했다. https://github.com/kitloong/json-server-vercel GitHub - kitloong/json-server-vercel: Deploy JSON Server to Vercel Deploy JSON Server to ..

티스토리툴바