반응형 언어공부102 AWS EC2 502 Bad Gateway 에러로 소환... 요즘 본격 개발일은 쉬고 뚱땅뚱땅 놀면서 쉬운일만 하면서 살고있었는데 예전에 외주로 만들었던 웹사이트가 안된다고 연락을 받아서 오랜만에 AWS에 접속했다. 2년동안 개발자로 일하긴 했는데 서버지식은 별로 늘지 않은듯 하다... 반성의 시간을 잠시 가지며 AWS에서 이것저것 만졌는데 안됨ㅠㅠ 오랜만에 아침부터 내마음도 몰라주는 컴퓨터랑 싸우는 짜증을 느껴보았다. 일단 오늘 일정이 있어서 잠깐 나갔다와서 리프레시된 머리로 다시 이것저것 확인해보니 어제 새벽 2시에 갑자기 트래픽이 엄청 몰렸던걸 확인할 수 있었다. 이 홈페이지에 이정도 트래픽이 몰릴일이 없는데 무슨일이지... 이 작은 회사를 공격할리가 없는데 누군가 재능낭비한걸까...? 아무튼 대충 예상해보니 트래픽이 몰려서? 또는 어떤 이유로 EC2 서버가.. 2023. 10. 14. [Redux] 리덕스 용어 정리, 리덕스의 규칙 리덕스에서 사용되는 키워드 액션 (Action) 상태에 어떠한 변화가 필요하게 될 땐, 우리는 액션이란 것을 발생시킵니다. 이는, 하나의 객체로 표현되는데요, 액션 객체는 다음과 같은 형식으로 이뤄져있습니다. { type: "TOGGLE_VALUE" } 액션 객체는 type 필드를 필수적으로 가지고 있어야하고 그 외의 값들은 개발자 마음대로 넣어줄 수 있습니다. { type: "ADD_TODO", data: { id: 0, text: "리덕스 배우기" } } { type: "CHANGE_INPUT", text: "안녕하세요" } 액션 생성함수 (Action Creator) 액션 생성함수는, 액션을 만드는 함수입니다. 단순히 파라미터를 받아와서 액션 객체 형태로 만들어주죠. export function a.. 2022. 6. 11. [Redux] 리덕스 간단 정리 이직 후 리덕스로 거의 모든 상태관리를 하는 프로젝트에 투입이 되었다. 이전 회사에서 처음 리액트를 배울 때 당연히 리덕스 공부는 해야 했고 사용도 했었지만 리코일이나 다른 라이브러리 사용으로 넘어가면서 사용이 뜸해지면서 거의 잊혀지고 있었는데, 이번 프로젝트 코드가 엄청 방대하고 복잡하다보니 기본 개념이 안 잡힌 상태로 코드를 파악하다가 멀미가 날 지경이었다. 그래서 오랜만에 약속이 없는 주말을 맞아 리덕스를 기초부터 공부해보기로 했다. 동영상 강의는 공부가 막막할때, 기초 개념 공부할 때 항상 도움받고 있는 내사랑 이고잉님과 코딩애플님이 도움을 주셨다 :) 텍스트 문서로는 벨로퍼트님의 블로그를 참고해서 공부했다. 감사합니다 스승님들!! 리덕스란? 상태관리 라이브러리 리덕스 쓰는 이유 1. props .. 2022. 6. 11. 내돈내산 코딩애플 Node.js, MongoDB 강의 리뷰 유튜브에서 이분 강의 보면서 많이 배웠는데, 노드랑 몽고DB를 한번 써보고 싶어서 강의를 찾다가 무료강의에서 이어지는 유료 강의가 있어서 처음으로 코딩애플 강의를 구매해 보았다. 강의 제목은 Node.js, MongoDB로 2시간 만에 빠르게 웹서비스 만들기 이다. https://codingapple.com/course/node-express-mongodb-server/ Node.js, MongoDB로 2시간 만에 빠르게 웹서비스 만들기 - 코딩애플 온라인 강좌 누구나 마음 한켠엔 나만의 웹서비스를 만들고 싶어합니다. 프론트엔드는 어찌저찌 하겠는데 서버 만드는게 어렵고 귀찮다고요? 그렇다면 Firebase를 쓰십시오. 구글이 웹서버를 대신 만들어 codingapple.com 이 강사분이 좋은게, 내용은 .. 2022. 5. 27. [Google I/O 2022] What's New in Android 13 요약 가이드 해석 같이 일하셨던 안드로이드 개발자분이 아래 영상의 해석을 부탁하셔서 대충 해석을 해보았다. 한국어 해석이 없어 난감한 한국인 분들에게 조금이라도 도움이 되길 바라는 마음에 블로그에 올려본다. 대본처럼 짧게 짧게 해석본을 넣어 두었으니 영상은 따로 화면을 띄워놓고 대본과 함께 보면 이해가 쉬울 것 같다. 농담 부분은 내 맘대로 의역했고, 기술적인 부분은 구글 번역기 도움도 받았음을 미리 밝힌다! 관련 자료 Google I/O 2022 : https://io.google/2022/intl/ko/ 해당 영상: https://youtu.be/Z6iFhczA3NY 대본 해석 NICK BUTCHER (남자): Welcome to "What's New in Android,"your guided tour through .. 2022. 5. 27. use-query-params 로 queryString 관리하기 use-query-params 라이브러리를 사용하면 Default 값도 사용할 수 있고, 각각의 쿼리의 타입도 지정할 수 있어서 편하다. 아래와 같은 형식으로 set을 하면 queryString이 자동으로 관리된다. (자세한 내용은 맨 밑의 공식 문서 참고) const [query, setQuery] = useQueryParams({ pageNo: withDefault(NumberParam, DEFAULT_PAGE_NO), pageSize: withDefault(NumberParam, DEFAULT_PAGE_SIZE), sortColumn: withDefault(StringParam, DEFAULT_SORT_COLUMN), sortOrder: withDefault(StringParam, DEFAULT_S.. 2022. 4. 3. React API 에러 처리 아래 글은 현재 우리 회사 프로젝트의 에러처리에 관련한 고민을 하다가 찾게된 화해 기술블로그이다. 화해의 기술들이 우리 회사의 기술들과 유사한 부분이 많아서 같이 고민하는 느낌이든다! 왜 API 에러 처리에 대한 고민을 하게 되었나? 현재 제가 담당하고 있는 프로젝트 중에 하나가 오래전에 만들어진 제품을 유지보수하는 프로젝트입니다. 해당 프로젝트는 흔히 말해 레거시 개선 프로젝트였습니다. 이 프로젝트는 설계에 대한 깊은 고민보다는 필요한 기능들을 우선적으로 추가해야만 했던 시기에 만들어진 것으로 보입니다. 그래서인지 여러 부분에서 체계가 미흡한데, API 에러 처리 체계도 그중 하나였습니다. 여러 군데에서 비슷한 에러 처리 로직을 개별적으로 작성하거나 공통적으로 다루어져야 하는 로직도 반복해서 작성되어 .. 2022. 3. 28. URLSearchParams, 주소 쿼리스트링, 파라미터 변경 오늘은 URL 관련 유용한 Hooks 유틸 함수를 알아볼거에요 먼저 알아볼 함수는 2가지 인데요! PathParam을 쉽게 구하는 함수 usePathParam QueryString을 쉽게 구하는 함수 useQueryString 함수를 알아보기전에 PathParam과 QueryString에 대해서 알아보겠습니다. 1) QueryString http://host:port.com/posts?id=1 이런 URL중 ? 뒤에 id란 변수에 값을 담아 백엔드에 전달하는 방식이 QueryString 방식이에요. 해석하자면 posts에 담긴 정보중 id가 1인 posts자료를 달라는 것이죠 2) PathParam http://host:port.com/posts/1 QueryString에서 보여준 URL과 같은 내용이지.. 2022. 3. 27. nodejs 타입스크립트 환경설정, jsconfig.json 활용 Type Checking 자바스크립트는 타입 체크를 하지 않기 때문에 타입 오류가 발생함 이에 타입을 체킹하는 것이 중요하고 도구가 필요함 가장 인기가 있는 타입스크립트는 자바스크립트에 타입 정의만 얹어놓은 느낌 const someString = 'Hello' const result = Math.log(someString) 위와 같은 경우에 타입에러가 발생함. 타입스크립트 사용 타입스크립트, eslint 를 설치 후 상단에 @ts-check 를 추가하면 타입 체크가 가능 node에서 타임스크립트 도움받기 npm install --save-dev @types/node vscode가 타입스크립트 바이너리를 이용하여 타입체킹을 도와줌 const http = require('http) const server =.. 2022. 3. 9. CSS의 7가지 단위 - rem, vh, vw, vmin, vmax, ex, ch CSS Unit (CSS 7가지 단위) 우리가 잘 알고 있는 CSS기술을 사용하는 것은 쉽고 간단할 수 있지만 새로운 문제에 봉착하게 되면 해결하기 어려울 수 있습니다. 웹은 항상 성장,변화하고 있고 새로운 해결방안 역시 계속 성장하고 있습니다. 그렇기 때문에 웹 디자이너와 프론트 엔드 개발자가 습득한 노하우를 활용할 수 밖에 없다는 것을 잘 알고 있습니다. 특별한 방법을 알면서, 단 한 번도 사용하지 않더라도 언젠가 필요한 때가 오면 정확한 방법을 실무에 적용할 수 있다는 뜻이기도 합니다. 이 글에서는 이전엔 알지 못했던 몇 가지의 CSS 방법에 대해 알아보고자 합니다. 몇몇 수치 단위들은 픽셀이나 em과 비슷하지만 다른 방법에 대해 살펴보도록 합니다. rem(root em) 여러분에게 조금 익숙할 수.. 2021. 9. 14. 이전 1 2 3 4 ··· 11 다음 반응형
