본 글은 2023년 4월 25일 시점으로 쓰여진 글입니다. 쏟아지는 별을 못 본지 오래 됐다는 생각이 들어서토요일 아침,남자친구(현 남편)에게 은근슬쩍 말을 던져보았다. "진짜 하늘에!!!!!쏟아져 내릴 것 같은!!!엄청 많은 별들 보고싶은데평창 갈래?" "그래!" .............. 우리 둘의 MBTI는J가 아닌 P인 것이 확실하다.의심할 여지 없음...(본인 ESTP, 남자친구 ISFP) 그렇게 정말 오래간만에떠나게 된 강원도. 가죽공예가 취미인 나는자주 키링을 만들어서 뿌리거나 파는데,남친이 이건 자기 하겠다며 가져갔다. 더 예쁘게 만들어주겠다니까 참...빨리 만들어줘야겠다. 그렇게 도착한 둔내 비박을 염두해둔 우리는미리 맛있는 것을 사서저녁으로 먹을 심산이었고 원래 계획은 리얼 ..

본 글은 2023년 4월 26일 시점으로 쓰여진 글입니다. 경기도에 살다가 서울로 이사를 왔는데원래 경기도도 경기 남부,서울은 강의 남쪽에서 주로 살던 나는(강남, 동작, 구로, 흑석, 경기광주...) 북쪽을 처음 와서 아직 낯선 상태였다. 이전에는 북쪽 동네가 괜시리 낯설어서정나미가 안 붙을 것 같았는데, 우와 여긴 대박이야!!!! 하며정을 붙이게 해준 고마운 곳이 있다. 바로 석계역 부근의'일번지 포장마차'. 일번지포장마차서울 노원구 화랑로 337-4 1층 (월계동 36-5)place.map.kakao.com 영업 시간 14:00 - 02:00석계역 1번 출구 도보 1분 거리(위치가 매우 쉬워서 접근성 최고!) 여기는 회와 물회를메인으로 판매하는 곳 같지만 나는 여기서 회 종류를..

인하대학교 공학대학원 인공지능융합 전공3년간의 사투 끝에 드디어 졸업을 했습니다. 보통 2년 과정이긴 하지만중간에 휴학을 1년해서 3년이 걸렸네요.    사실 저와 같은 개발자혹은 IT 업종에 종사하시는 분들께서자기계발을 위해 석사 과정을많이 고민하시는 걸로 압니다. 아마 이 글을 보시는 분들도그런 고민이 있으신 분들이 대부분일거라 생각해요.그래서 제가 공학대학원을 다니게 된 계기와과정, 이후 현실에 대해 진솔하게 얘기해보고자 합니다.    1. 일반대학원이 아닌 공학대학원을 선택한 이유 공학대학원은 다들 아시다시피 야간에 수업이 진행되는 특수대학원 형태입니다. 저의 경우 서울에 있는 9군데 학교의 면접을 봤었고, 합격한 곳은 4곳이었으며 그 중에서 커리큘럼과 교수진, 등록금, 환경 등 모든 것을 고려..

나의 경우에는 backend, frontend를 하나의 repository에 넣기 위해서각각의 repository를 지우고 하나로 다시 repository를 구성했다. 예를 들어서 최상위 폴더가 Fruits이고,banana 프로젝트와 apple 프로젝트를 최상위 폴더에 넣어줘야한다. 그런데, Fruits 폴더에서만 git add를 해버리면banana, apple 폴더 자체는 add가 안 된다. 아래 명령어들을 요약해서 기재한다. echo "# [최상위 repository 이름]" >> README.mdgit initgit add README.mdgit commit -m "first commit"git branch -M maingit remote add origin [최상위 repository URL]gi..

이슈들과 빅 이벤트들이 총 집합되었던 2024년, 연말을 맞아 지난 한 해 정리를 해보고자 한다.너무 TMI인 것들은 빼려고 노력했지만 마음처럼 안 됐을 수 있음.  1월  지금의 남편과 결혼을 결심하고 본격 결혼 준비를 시작한 달이다.우리가 연애를 대략 3-4년 정도했으니, 서로가 언젠가는 결혼을 할 것이다라는 전제가 있었지만 누구 하나가 강력하게 밀어 붙이기 쉽지 않았고, 결혼 준비가 제대로 됐다는 생각이 전무했다. 그래서 사실 결혼이라는 것은 막연하기만 한 그저 먼 나라 이야기 같았다. 그러다가 1월 어느 평범했던 주말, 할게 없었던 우리는 문득 남편의 제안으로 데이트 겸 결혼 박람회를 가보게 되었는데...(우리 둘 다 호기심 많은 편) 절대 계약만큼은 하지 않기로 약속하고 박람회장에 들어선 우리는..

플러터에서 파이어베이스 연동을 하는 과정에서 다음과 같은 오류를 발견했다.     아주 지긋지긋했다 몇 시간동안 이 오류를 본건지...Launching lib/main.dart on iPhone 14 Pro in debug mode...Running pod install... 8.2sRunning Xcode build...Xcode build done. 6.4sFailed to build iOS appError (Xcode): unsupported option '-G' for target'x86_64-apple-ios15.0-simulator'Cou..

1. 목적[인수 조건]Given개발자는 주민등록번호 유효성 검증을 위한 정규식을 이용한다.코드가 길어질 경우 라이브러리 React-hook-form을 사용할 수 있다.text input 2개로 구성된 컴포넌트로 구현한다.When주민등록번호 컴포넌트 GUI와 유효성 검증하는 함수로 각각 분리한다.Then1. 00년생 이전/이후와 생년월일, 성별 케이스별로 나누어주민등록번호의 뒷 번호 첫 번째 자리까지 유효성 검증을 진행한다.2. 실시간으로 유효성 검증이 진행된다.3. 올바르지 않은 주민번호 입력시 가이드 텍스트가 표시된다. [설명]보상 안내 받는 이와 예금주의 주민등록번호를 받았을 때 실시간 유효성 검증 기능이 있는 주민등록번호 컴포넌트를 구현한다.케이스는 00년생 이전과 이후로 나뉘며앞, 뒷 번호 자릿수..

목적Next.js 프레임워크 내에서 .env 파일 내의 S3 관련 Secret Key 노출을 방지할 수 있는 방법을 모색함빌드 후 배포시 .env 파일이 유실되어 릴리즈 버전에서 s3 접근에 리스크 존재, 이를 방지하기 위함AWS Secret Manager사용 방법https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/clients/client-secrets-manager/import * as AWS from "@aws-sdk/client-secrets-manager";const client = new AWS.SecretsManager({ region: "REGION" });// async/await.try { const data = await client.l..

// psuedo codeclass Person { name: string; foo() { console.log(this.name); } constructor(name: string) { this.name = name; }}const p = new Person('kim');console.log(JSON.stringify(p));console.log(JSON.parse(JSON.stringify(p)));function bar(): string { let result = ''; // result가 try에서도 catch에서도 사용해야 할 경우 (부득이) try { result = 'success'; ..

목적정확한 세그먼트 이름을 미리 알지 못하고 동적 데이터에서 경로를 생성하는 경우 요청 시 채워지거나 빌드 시 사전 렌더링되는 동적 세그먼트를 사용할 수 있다.Next.js의 Slug를 적극 활용해야 하는 이유App routing의 Slug 기능을 사용하여 동적 라우팅(Dynamic Routing)을 구현하려고 한다. 이 기능은 일반적으로 다음과 같이 사용된다.// app/blog/[slug]/page.tsxexport default function Page({ params }: { params: { slug: string } }) { return My Post: {params.slug};}이렇게 path param(segment)으로 온 param 데이터를 사용할 수 있는 것이 장점이다.그런데, ..

분석 계기https://bizinsight.atlassian.net/wiki/pages/createpage.action?spaceKey=Software&title=1.%20Excel%20%ED%8C%8C%EC%8B%B1B2B 여행자 보험 가입 서비스 프로젝트에서 가장 중요한 기능인 Excel 파싱 기능 관련하여 어떤 라이브러리를 사용할지 기술 검토를 했었다. 그 결과, xlsx 라이브러리(SheetJS)를 사용하는 것이 가장 적절하다고 판단하여 개발팀에 공유를 하였다. 그렇다면, 이 xlsx 라이브러리로 어떤 기능들을 구현해야 할지 보다 디테일하게 분석을 해보려고 한다.필요한 기능정해진 양식의 엑셀 파일에 원하는 정보를 리스트업하고, 해당 엑셀 파일을 정확하게 읽어오는 것정확하게 읽어온 데이터를 UI 상..

0. Prologue사이트를 개발하겠다고 하면 빠질 수 없는 회원 관리와 로그인. 그런데, 솔직히 정작 ‘로그인은 어떻게 구현하는가?’에 대해서 깊게 고민해본적은 없었던 것 같다. 그래서, 이번 기회로 집중해서 알아 보게 되었다.단순하게 생각하면 ‘그냥 유저 테이블에 아이디, 이메일, 비밀번호, 연락처 등 정보 넣고, 비밀번호는 암호화해서 넣으면 되는거 아니야?’라고 생각할 수도 있다. 하지만, 유저 테이블에 아이디와 비밀번호를 암호화해서 넣는 방식은 이제 절대로 쓰면 안 되는 방법이다. 상당히 구식일 뿐더러, 보안에 틈이 많아 추후 문제가 생길 소지가 다분하다.그래서 위 방법으로부터 발전된 형태는 유저 테이블에 저장된 비밀번호 해시값을 사용자의 입력에 따른 해시값과 비교하여 동일하면 true가 되는 방..

요약최근까지만 해도 Recoil이 공식적으로 SSR을 지원하지 않았는데, 최근 문서에 SSR 대처 방안을 업데이트 해주었다.알아본 김에 Zustand와 Recoil의 장단점과 특성을 파악하면 적재적소에 활용하기 좋을 것 같아 개인적인 호기심으로 조사해보았다. 알아보게 된 계기이전 프로젝트를 진행하며 서버 사이드와 클라이언트 사이드 데이터가 불일치하는 문제로 인해 쿠키, 세션을 활용하여 이슈를 해결하셨던 부분을 인지하고 있었다. 분명 이와 같은 상황이 다른 개발자들도 있었을 것으로 판단하여 더 나은 해결 방법이 없는지 확인하던 중 zustand로 해결했다는 어느 포스팅을 발견 후 본격적으로 알아보기 시작하였다.jotai는 월등히 좋다면야 알아보겠지만 지금으로서는 recoil, zustand만 알아봐도 충분..

요약react-dnd는 Drag & Drop이 필요한 더 넓은 범위로 활용 가능한 라이브러리라서 react-dropzone만 사용해도 될 것 같다. 1. react-dropzone 샘플 코드// ...const [acceptedFiles, setAcceptedFiles] = useState([]);const onDropFiles = (acceptedFiles: File[]) => { setAcceptedFiles(acceptedFiles); console.log(acceptedFiles);}return ( // ... {({getRootProps, getInputProps}) => ( ..

요약React-papaparse는 csv만 가능해서 xlsx → csv convert 과정이 추가로 필요하나,xlsx는 xlsx파일, csv 파일 둘 다 import 가능하며, json 변환도 쉽다.(단, xlsx 라이브러리로 xlsx 파일이 아닌 csv 파일을 파싱할 경우 특수문자가 나오는 문제가 있음.) Papaparse vs React-papaparsepapaparse: 브라우저, Node.js 모두에서 사용할 수 있으며, 큰 파일, 문자열, 스트림을 CSV로 변환하거나 CSV를 JSON으로 변환하는 기능을 제공import Papa from 'papaparse';Papa.parse(file, config); const csv = Papa.unparse(data[, config]);react-p..

**컴포넌트 주도 개발(Component Driven Development)Next.js Typescript 프로젝트에 적용하는 방법 (최초)npx create-next-app --typescript start-storybookStorybook 초기화npx sb init --builder webpack5 스토리북 초기화 명령어를 치면 위와 같은 메시지가 뜨고package.json에는 storybook dev dependencies가 자동으로 추가된다.{ // ... "scripts": { // ... "storybook": "storybook dev -p 6006", "build-storybook": "storybook build" }, "devDependencies": { ..

‘비동기(Asynchronous)'란?서버로 보낸 요청에 서버가 응답할 때까지 기다리지 않고, 다른 처리를 할 수 있는 행위콜백 지옥을 Promise의 등장으로 해결할 수 있게 되었다.1-1. Promise미래의 어떤 시점에 결과를 제공하겠다는 ‘약속’ 반환const myPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve(1); }, 1000);});myPromise.then(n => { console.log(n);});작업이 끝나고 나서 또 다른 작업을 해야 할 때에는 Promise 뒤에 .then(...) 을 붙여서 사용하면 된다.const myPromise = new Promise((resolve, reject)..

프로젝트가 얼추 마무리 되고 라는 책을 펼쳐 읽다가 문득 프로토타입에 대한 이해 부족한 듯 해서 하기 코드를 이해하려고 노력 중이다. (아직 이해가 안 되고 있음) if(typeof Object.create !== 'function') { Object.create = function (o) { var F = function () {}; F.prototype=o; return new F(); }; } var another_stooge = Object.create(stooge); 먼저 'Object.create'가 존재하는지 확인합니다. 'Object.create'는 일반적으로 객체를 새로 만드는 JavaScript 내장 함수입니다. 그러나 이 코드는 이 기능이 존재하지 않았을 경우를 대비해 만들어졌습니다...

지금 티스토리 블로그를 하고 있지만 개발 관련한 부분은 깃허브 블로그로 이관하고자 깃허브 블로그를 셋팅하던 중, 아주 골칫거리를 하나 만났다. 바로 Ruby! 며칠 조금씩 건들이며 계속 답답해하던 중 해결책을 찾아 공유해본다. 사실 간단했다. 요약하자면, 1. ruby가 기본적으로 셋팅된 2.6.0 버전은 기존 mac 운영체제 파일의 의존성때문에 냅두고, 2. 최신 버전을 추가로 설치하여 switching 해준다. 3. gem 경로의 home 셋팅을 다시 해준다. 사실 이것이 문제가 됐던 원인은 gem 경로를 flutter 환경 설정하면서 zshrc에 박아두었던 것도 에러의 원인 중 포함이었다. 꼼꼼하게 vi를 보지 않았던 탓... 아무튼 시간 낭비를 줄이기 위해 이 포스팅이 도움이 되시길 바란다. ❯ ..

삼항 연산자를 활용한 조건부 렌더링 function Body() { const num = 200; if (num % 2 === 0) { return {num} is 짝수입니다 ; } else { return {num} is 홀수입니다 ; } // return ( // // // {num} is {num % 2 === 0 ? "짝수" : "홀수"} 입니다.{" "} // // // ); } 삼항 연산자는 간결하지만 가독성을 해칠 우려가 있다. 조건문은 가독성은 좋으나 중복 코드 발생 우려가 있다. 컴포넌트에 값 전달하기 import React from "react"; import "./Body.css"; function Body({ name, location, favorList }) { console.lo..

const originList = [ [1, 2], [3, 4, 5], [6, 7, 8, 9],];const reduceZipResult = originList.reduce((acc, cur, idx) => { for (let i = 0; i

let list = [1, 3, 4, 5, 6, 10];function filter(list, predicate) { let new_list = []; for (let i = 0; i 5;}let filterResult = filter(list, predicate);console.log(filterResult);function myMap(list, func) { let result = []; for (let i = 0; i = 3;}let reduceFilterResult = myReduceForFilter(list, ageThreeUp, []);console.log(`reduceFilterResult : ${reduceFilterResult}`);//////////////////..

function solution(arr) { let answer = []; for(let i = 0; i < arr.length; i++) { if(arr[i] !== arr[i+1]) { answer.push(arr[i]); } } return answer; } arr = [1, 1, 3, 3, 0, 1, 1] 이면 [1, 3, 0, 1] 을 return 합니다. arr = [4, 4, 4, 3, 3] 이면 [4, 3] 을 return 합니다. 얼핏 보면 중복을 제거하는 문제로 보이지만 첫 번째 케이스 [1, 3, 0, 1] 케이스는 중복을 제거한 결과가 아니다. 따라서 단순 중복 제거로 includes() 함수를 쓰면 안 된다. arr[0]과 arr[1]을 비교해서 같은 숫자이면 다시 돌고, 다른 숫..

_.zip()import _ from "lodash";const list1 = ['a', 'b']const list2 = [1, 2];const list3 = [true, false];/** * 1. Lodash zip() */const lodashZip = _.zip(list1, list2, list3);console.log(lodashZip); // [ [ 'a', 1, true ], [ 'b', 2, false ] ]/** * 2. myZip() 구현 */function myZip(...arr) { let zipResult = []; // [0, 0], [1, 0], [2, 0] -> [0, 1], [1, 1], [2, 1] for(let i = 0; i _...

_.uniq(array) 함수는 Lodash에서 배열 내의 중복을 처리하는 array 함수이다.해당 함수를 ES6 Javascript로 짐작하여 구현해봤다. 1. 첫 번째 방법 -> Object.keys()를 활용하여 key값들만 불러와 중복을 처리하는 방법. import _ from "lodash";const list = [9, 4, 3, 4, 5, 7, 7, 5, 9, 10];const lodashUniq = _.uniq(list); // [ 9, 4, 3, 5, 7, 10 ]console.log(lodashUniq);/************* * 첫 번째 방법. Object.keys() 방법 * 자동 정렬이 된다. => [ 3, 4, 5, 7, 9, 10 ] **/function myUniq..

const list = [3, 4, 3, 5, 10, 7, 1, 5, 4, 10];function mySet(list) { let result = {}; for (let i = 0; i Set 함수를 사용하지 않고 날 것으로 mySet 함수를 구현해보았다.Object 객체를 만들고, Key 값으로 따져볼 것이다. 만일 해당 숫자가 Key로 존재한다면 value에 해당 숫자를 한 번 더 추가해준다.존재하지 않는다면 Key를 추가해준다. 기존 Set 함수와는 차이가 있는 것이 Set 함수는 정렬을 해주지 않고 중복 제거만 해주며 Object 형태로 반환해준다.반면, Object.Key()의 경우에는 반환을 배열로 해준다. 그러나 Object는 순서를 보장해주지 않기 때문에 100% 신뢰하기는 어렵다...

1. Mapfunction myMap(list, func) { let result = []; for (let i = 0; i (x % 2 === 0 ? true : false));console.log(example);console.log(myMap(list, (x) => (x % 2 === 0 ? true : false)));map 함수 내부를 구현해보았다. 어려운 것은 아니고, 따로 myMap을 만들어서 내부적으로 어떻게 동작하는지 짐작하여 구현해보았다.여기에서 중요한 포인트는 Javascript에서는 일급 객체인 함수를 매개 변수로, 인자로, 리턴값으로 사용할 수 있다는 것이다.따라서 func라는 매개 변수를 두었기에 인자로 함수를 받을 수 있었다. 2. Filter function myFilt..

Q. N개의 숫자로 이루어진 배열를 받았을 때 조합할 수 있는 순열 경우의 수를 모두 구하자. function doTree(input) { let doTree_result = []; let result = []; if (input.length > 3) { for (let i = 0; i < input.length; i++) { let prev = 1; let copyArr = [...input]; prev = copyArr.splice(i, 1); doTree_result = doTree(copyArr); for (let j = 0; j < doTree_result.length; j++) { doTree_result[j].splice(0, 0, prev); console.log(`doTree_result..

function solution(array, commands) { let answer = []; for (let i = 0; i a - b); answer.push(copyArray[commands[i][2] - 1]); } return answer; } 2번째부터 5번째까지 잘라야 한다는 말은 인덱스 1번째부터 4번째까지 잘라야 한다는 말과 같다. 문제상에서 나오는 ~번째라는 말은 모두 -1로 배열상의 인덱스로 바꿔주고 sort()는 오류가 많으니 ..

function solution(letter) { let morse = { ".-": "a", "-...": "b", "-.-.": "c", "-..": "d", ".": "e", "..-.": "f", "--.": "g", "....": "h", "..": "i", ".---": "j", "-.-": "k", ".-..": "l", "--": "m", "-.": "n", "---": "o", ".--.": "p", "--.-": "q", ".-.": "r", "...": "s", "-": "t", "..-": "u", "...-": "v", ".--": "w", "-..-": "x", "-.--": "y", "--..": "z", }; let answer = ""; letter.split(" ").ma..

function solution(n) { let i = 1; let answer = 0; let result = 1; while (true) { result *= i; if (result > n) { answer = i - 1; break; } i++; } return answer; } let result = factorial(3628800); console.log(result); if문에 result > n 조건이 되면 이미 넘어버린 i값이 들어오고 break가 걸리므로 i-1값을 최종값으로 return해주었다.

function getGCD(input) { if (input[0] < input[1]) { let temp = input[0]; input[0] = input[1]; input[1] = temp; } let r = input[0] % input[1]; input[0] = input[1]; input[1] = r; if (input[1] === 0) { } else { getGCD(input); } return input[0]; } function getLCM(nums, gcd) { let lcm = (nums[0] * nums[1]) / gcd; return lcm; } let nums = [500, 100]; let inputNums = [...nums]; let gcd = getGCD(inputNu..

처음 시도는 이렇게 했다. function solution(sides) { var answer = 0; var max = 0; var result = 0; for (let i = 0; i sides[j]) { max = sides[i]; } } } for (let i = 0; i max) { ans..

function solution(num_list) { var answer = 0; for(let i = 0; i < num_list.length; i++) { if(num_list[i] < 0) { answer = i; return answer; } else { answer = -1; } } return answer; } num_list 내에 -1가 나오는 순간 지체할 필요 없이 인덱스를 return하면 된다. 양수일 경우에는 계속 -1을 담다가 return해버리면 된다.

// 최대공약수 구하기 function getGCD(twoNums) { console.log("getGCD() :: Start"); let divisors_0 = []; let divisors_1 = []; let commonDivisors = []; let pnYN = []; // 1. 먼저 두 수가 소수인지 아닌지 판별한다. pnYN.push(primeNumYN(twoNums[0]), primeNumYN(twoNums[1])); // 2. 두 수가 소수가 아니라면 if ( (pnYN[0] === false && pnYN[1] === false) || (pnYN[0] === false && pnYN[1] === true) || (pnYN[0] === true && pnYN[1] === false) ) ..

1. 10진수에서 2진수 만들기 function DecimalToBinary(n) { console.log(`${n}의 이진수 구하는 DecimalToBinary() Start`); let numsArr = new Array(); // 이진수를 담을 배열 생성 let binary; if(n > 0) { let naturalNum = n; let firstBinary = naturalNum%2; numsArr.push(firstBinary); while(true){ if(naturalNum > 0){ naturalNum = Math.floor(naturalNum/2); num = (naturalNum)%2; numsArr.push(num); } else { break; } } numsArr.reverse(..

Q1. function star_Q3(n) { let temp = (2*n)-1; // (가장 아래 별의 갯수 기준) 즉, temp = 2n-1 console.log(`Start star, temp is ${temp}`); for(let i=n; i>0; i--) { // star_Q3의 인자는 탑 높이(n) console.log(""); for(let j=1; jj || j>n){ // 탑 현재 높이(i) >= 별 갯수(j)보다 크거나 같을 경우, 별 갯수(j)가 탑 높이(n)보다 크거나 같을 경우 공백 처리 process.stdout.write(" "); } else { // 공백 처리된 나머지 부분에 별 찍기 process.stdout.write("*"); } } n++; // 탑을 한 층씩 쌓을 ..

const SYM = Symbol(); const o = { a: 1, b: 2, c: 3, [SYM]: 4 }; // 1번 방법 (for...in) // for(let prop in o) { // if (!o.hasOwnProperty(prop)) continue; // console.log(`${prop}: ${o[prop]}`); // } // 2번 방법 (Object.keys) // 객체의 프로퍼티 키를 배열로 가져와야 할 때 편리 Object.keys(o).forEach(prop => console.log(`${prop}: ${o[prop]}`)); 문자열 프로퍼티와 심볼 프로퍼티가 있는 o 객체가 있다. 단순해보이지만 중간에 hasOwnProperty가 눈에 띄인다. hasOwnProperty..

객체지향 - 상속, 합성, 인터페이스 복습! 캠핑을 가서 텐트를 치고 밥을 먹는다. 그런데, 만약 텐트 3동이 텐트를 옮겨야한다면 어떻게 해야할지 객체지향으로 구현해보자. 부모 클래스 - 캠핑 자식 클래스 - 경량텐트, 에어텐트, 차박텐트 class Camping { public void reservation() { System.out.println("Camping - reservation"); } } class LightTent extends Camping{ public void shortly() { System.out.print("빨리 피칭할 수 있는 경량 텐트"); } } class AirTent implements setUp { public void doPack(int pack) { System...

{ // 외부 블록 let x = { color: "blue" }; let y = x; let z = 3; { // 내부 블록 let x = 5; console.log(x); // 5 console.log(y.color); // blue y.color = "red"; console.log(z); // 3 } console.log(x.color); // red console.log(y.color); // red console.log(z); // 3 } 왜 x.color가 red가 되는걸까... y 변수에 x를 담는건데???

개인적으로 리액트를 상당히 좋아하는 편이다. 솔직히 내가 리액트를 좋아하게 된 계기는 로고가 예쁘고 퍼즐처럼 엮이는 모양새로 러닝커브는 쎄지만 한 번 구축해두면 재사용이 용이하고 무엇보다 문법이 예쁘기 때문이었다. (?). 가독성도 좋고, 조각조각 나있는 언어 구성이 아주 마음에 들었다. 그리고, 늘 리액트는 자바스크립트 기반의 라이브러리이기 때문에 바닐라 자바스크립트에 대해 잘 알아야 한다는 사실을 머릿속으로는 알면서도 막상 자바스크립트를 진지하게 공부할 생각을 하지 못했었다. 대충 위기 상황에 맞닥트리면 해결되지 않을까 안일하게 생각했던 것 같다. 그러다가 이번 이직 기회로 딥하게 공부할 기회가 되었는데, 막상 딥하게 들어가보니 정말 필요한 지식들이다. 과거 바닐라 JS로 프로젝트를 해보기도 했고 꽤..

먼저 neon에서 postgresql 스키마와 테이블, 더미 데이터들을 넣어준다. Dashboard에는 host와 password등의 정보들이 담겨있다. stepzen은 graphql을 편히 사용해주는 GUI인데 프로젝트 내에 stepzen 폴더를 만들어주고 폴더 내부에서 stepzen 정보를 입력해주면 손쉽게 graphql을 적용할 수 있다. index.graphql을 확인해보면 postgresql로 만든 데이터들이 담겨져 있다. 처음 써보는 거라 아직 익숙치는 않음. 터미널에서 가동시켰던 stepzen url에 들어가면 graphql cli가 나온다. builder에서는 클릭하면 자동으로 gql을 입력해줌. 와 뭐지 신세계...

https://yozm.wishket.com/magazine/detail/2113/ 개발자에게 편리함을 주는 ‘GraphQL’ 도입 시 주의할 점은? | 요즘IT 프론트엔드 개발자에게 API 통신 비용은 언제나 고민되는 요소다. 모던 브라우저의 경우 성능이 많이 좋아져서 유저가 불편할 정도의 지연은 자주 발생하지 않지만, API 통신은 네트워크 환경의 yozm.wishket.com 솔직히 REST API 상당히 편하고 익숙한 것은 맞는데 일일이 프론트엔드와 백엔드 소통이 필요한 것은 좀 귀찮았음. GraphQL 도입해보자. 에러에 대한 핸들링은 까다롭다고는 하나 RestAPI도 섞어 혼용해서 사용도 가능하다고 하니...

isFirst를 boolean type으로 가정한다. {/* Experience */} Experience {user.experience?.map((experience, index) => ( ))} export default function ExperienceListItem({ experience, isFirst, }: ExperienceListItemProps) { return ( {experience.title} {experience.companyName} ); } type ExperienceListItemProps = { experience: Experience; isFirst: boolean; }; export default function ExperienceListItem({ experience..

SDK 경로도 더블 체크했을 때 올바르게 설정되었고, 안드로이드 스튜디오에 React native 프로젝트가 아닌 My Application으로 Empty Activity 설정으로 프로젝트를 만들어 에뮬레이터를 띄우면 제대로 띄워지는데 유독 RN으로 npm run android 하면 에뮬레이터가 구동 되지 않았다. 후...하루종일 구글링해서 해봤는데 해결되지 않았다. 깃허브에 올라와있는 m1 유저들을 위한 에뮬레이터를 dmg로 받기도 했는데 설정이 복잡하기도 하고 애초에 완전 해결책은 아니라고들 구글에서 얘기하더라. 그래서 아예 갤럭시 핸드폰(플립3)을 개발자 옵션을 켜서 (USB 디버깅 토글 활성화) 연결하여 직접적으로 키니 그제서야 제대로 구동되었다. 이 때에도 초반에 갤럭시가 처음에는 제대로 인식을..

Platforms 탭의 리스트 아래 + 버튼을 누르면 시뮬레이터가 나온다. Xcode를 앱스토어에서 다운 받으면 이런 현상이 생긴다고 한다. 예전 개발자 홈페이지에서 다운 받으면 Components 탭이 있다고 함. 그런데 아마 지금은 플랫폼 탭으로 통일된 것 같음.

요즘 새로 나와서 편의점에서 구하기 약간 힘들다던데 나는 2번 시도 끝에 GS25에서 겟함 개인적으로 먹태, 황태, 명태 등 태로 끝나는 건어물 생선류 상당히 좋아하는 편 예를 들면 소주에는 먹태 황태는 그냥 건조된거 먹기도 하고 (고양이들 간식으로도 좋음) 명태는 명태식해 막국수랑 명태조림 이런거 상당히 좋아하는 취향 다행히 2+1이어서 3개 사와버렸다. 가격은 한 봉지에 1700원이었던 듯 얼마나 맛있는지 볼까 생긴 것은 기존 새우깡 두께의 1.5배에 양념 발라놓은 모양새 청양 마요 시즈닝이 들어간거라서 양념 맛이 강했음 가루가 손가락에 솔솔 묻어남 우리집 고양이가 황태에 환장해서 태짜로 끝나는 생선류라고 하면 덩달아 함께 환장한다. 먹태깡도 스멜이 강하게 났는지 탐하길래 강하게 혼내줬음… 너 이거 ..

과거 우리들의 블루스를 감명 깊게 본 우리는 제주도에서 고기국수로 유명하다는 삼대 국수회관 본점에 다녀왔다. 과연 베지근했을까? 행복국수 혹은 행운국수 맛이었으면 좋겠다. 주차장은 나름 가용 대수가 꽤 있는데 입구가 상당히 빡세다. 1차선(?) 이어서 만약 들어오는 차가 있으면 빠꾸해서 비켜줘야한다. 우리도 제주도 여행객인지라 렌트카였는데 살짝 긴장했다. 주차장을 통해 삼대국수를 먹으러 바로 올라갈 수 있다. 가끔 웨이팅도 하는지 캐치테이블이 놓여져 있었다. 다행히 우리가 갔을 때에 웨이팅을 하진 않았다. 오우 맛집이 맞긴 한건지 상당히 사람이 이미 많았다. 자리들도 많고 넓어서 여기에서 웨이팅까지 있으면 정말 사람들이 엄청나게 많은건데... 타이밍을 잘 잡았구나 싶었다. 고기국수는 1인분에 9천원으로 ..

몇주 전 백패킹 가기 전에 다녀온 양평 리버뷰 카페 드립니다 (이름이 진짜 드립니다) 근처 스타벅스에 가자니 주차비가 발생되기도 하고 오래 있을 것도 아니었어서 급히 찾아서 간 곳 치고 만족스러웠다. 주차는 오리가 엄지척하고 있는 곳에 1-2대 정도 가능한데 주차 공간은 협소해서 조금 아쉬웠다. 입구에 들어가면 아기자기하고 깔끔한 인테리어의 카페를 만날 수 있다. 백패킹 가기 전이라 등산복 차림으로 거울 셀카 한 번 찍어주었다 ㅎㅅㅎ 좌석은 리버뷰를 보면서 간단히 자리하기 좋은 좌식형 좌석들도 있었다. 우리는 잠시 노트북을 해야했기 때문에 2층으로 올라갔다. 역시 빠질 수 없는 아이스 아메리카노와 케익을 마셨는데 이게 세트 구성이어서 그냥 한 번 시켜봤는데 케익 순삭할 정도로 달달하고 맛있었다. 사진으로..

곱창 러버 곱순이인 나는 주기적으로 곱창을 먹어줘야 살맛이 나는데 오늘은 곱창전골에 소주가 땡겨 급히 곱창전골 맛집을 찾아보았다. 흔히들 리뷰 보고 방문하듯이 나 또한 리뷰를 보고 방문하였고, 숨은 맛집이라는 평이 보여서 고민 없이 바로 방문해봤다. 넝쿨곱창 (구)울타리곱창 중화역 4번출구 도보 5분 영업시간 매일 16:30 - 24:00 ☎ 0507-1308-1262 직접 여쭤보진 않았지만 가게 앞이라 주차 1대는 오피셜하게 가능하지 않을까 싶다. 나는 여기가 집 근처여서 걸어갔다. 메뉴판은 상기 사진과 같은데 타 흔한 곱창집들과는 달리 1인분 가격과 2인분 가격이 다르다. 2인분으로 주문했을 때 비교적 저렴하다. 곱창전골도 시세 평균 대비 2인분으로 주문했을 때 저렴한 편이다. 그리고 보통 곱창집들..

안녕하세요 고매입니다. 저는 티스토리 블로그와 함께 등산, 백패킹, 캠핑, 여행 위주의 레저 여행 네이버 블로그를 운영하고 있고 워드프레스는 최근에 셋팅을 시작했는데요. 네이버 블로그 개설은 2023.04.23에 했으며 첫 게시글은 2023.05.02 였고, 오늘이 블로그를 본격적으로 키운지 딱 51일째 되는 날입니다. 50일만에 이룬 성과로 나쁘지 않았다 생각해서 인증과 더불어 노력했던 부분들과 수익에 대한 부분을 적어볼까 합니다. 방문자수 인증 저는 현재 레저/스포츠 분야 네이버 인플루언서를 도전하고 있고, 그래도 단기간에 빠르게 성장시킬 수 있었던 성장 기록 겸 제가 노력했던 부분들을 가감없이 공유하고자 블로그에 남겨봅니다. 블로그 지수는 현재 준최1-3 사이를 오가고 있고 글 총 갯수는 63개,..

얼마 전 제주도에 놀러가서 남친 회사의 동료 가족분이 로컬이시라며, 로컬이 방문하는 찐 맛집이라고 해서 추천 받아 방문한 수희식당. 제주도에서 맛집을 가려내는 방법은 주차장에서 차들의 번호판을 유심히 보는 것이다. ㅎ자가 많이 들어간 렌트카가 많다면 관광객이 대부분인 식당이고, 그 외에 번호판이 많다면 어느 정도 로컬들이 인정하는 식당이라고 보면 된다. 수희식당은 주차장에 가보았을 때 약 50 : 50의 비율을 가지고 있었다. 수희식당 내부로 들어가기 전 대략적으로 메뉴를 볼 수 있는 표지판이 있는데 흔히 제주도의 생선 전문 식당에서 볼 수 있는 메뉴 구성이었다. 수희식당도 마찬가지로 갈치조림과 고등어조림이 메인인듯 보였다. 식당에 들어서니 꽤 사람들이 많았다. 맛집인 줄 알고 방문했는데 사람이 없는 것..

집 근처에 있어서 드디어 가보게 된 흥부골 갈비집. 공사가 끝나고 다시 재오픈한 이후로 가봐야지 생각만 하다가 한참 뒤인 어제서야 가보게 되었다. 결론부터 얘기하면 아주 대만족! 맛있었음. 메뉴는 왕갈비와 스테이크 돼지고기가 전부이다. 개인적으로 맛집이라고 생각하는 곳들은 메뉴가 다양하지 않고 선택과 집중을 하던데 여기도 마찬가지로 갈비에 집중을 하는 곳이었다. 가격도 300g에 19,000원이면 착한 편으로 보인다. 삼겹살도 180g-200g에 14,000원은 기본으로 하니까. 밑반찬은 양배추 샐러드, 떡볶이, 쌈류, 무 오이 반찬(?) 그리고 양념게장이 나온다. 양념게장 상당히 맵지도 않고 달달하니 맛있었다. 갈비집에서 밑반찬으로 게장과 떡볶이가 나오는 경우는 많이 없는데 꽤나 흥미롭게 다가왔다. 물..

안녕하세요 고매입니다. 오늘은 얼마 전에 발급 받았던 국립공원 스탬프 투어 여권 발급 받는 방법에 대해 말씀드리도록 하겠습니다. 국립공원 스탬프 투어 여권은 10개 스탬프를 찍었을 때 기념품과 완주증을 줍니다. 산쟁이에게는 이것이 명예 중 하나죠! 우리나라의 대표적인 메인 산들은 거의 국립공원에 속해 있으니까요 ㅎㅎ 저도 올해 안에 10개를 찍어보는 것이 목표입니다. 발급받을 수 있는 곳은 엄청 많은데 가기 전 미리 전화를 하시고 가셔야 합니다. 재고가 얼마나 남았는지 확인하신 후 출발하시는 것이 좋습니다. 전부터 계속 발급 받아야겠다 싶었는데 미루다가 이제서야 드디어 받게 되었네요!! 저는 서울에 거주하기 때문에 가장 가까운 '도봉산 공영주차장'으로 네비 찍고 출발했습니다. 공영주차장 외에 주차할 곳이..

안녕하세요 고목나무 매미입니다. 오늘은 연천으로 백패킹을 가기 전 너무 배가 고픈 나머지 저녁밥을 식당에서 먹고 갔는데요 조뚱씨가 7년 전 성남 야탑에서 즐겨 먹던 콩두가 없어져서 줄곧 슬퍼했었는데 집 근처 신내에 있는 것을 알고 바로 달려갔습니다. 옛날에 알고 있던 그 맛 그대로 밥 2그릇을 깨끗히 비우게 했던 콩두 봉화산역점을 소개합니다. 콩두 봉화산역점 주소 : 서울특별시 중랑구 신내로 225 디아뜨갤러리 157호 전화번호 : 02-3422-5560 영업시간 : 11:00 - 22:00(매주 일요일 휴무) 주차 : 봉화산역(남)환승주차장 봉화산역 환승주차장에 주차를 하면 바로 콩두를 쉽게 발견할 수 있습니다. 식사류와 함께 안주류도 판매합니다. 두부 베이스 식당이다보니 두부 요리들이 많은데 상당히 ..

계속되는 백패킹으로 인해 어깨, 목에 누적된 피로가 커서 마사지를 받으러 갔다 오는 길이었다. 괜시리 출출해져서 눈에 보이는 이삭토스트에 방문했다. 이삭 토스트는 다양한 메뉴가 있지만 유독 햄치즈만 손에 간다. 그 이유는 학창시절에 햄치즈만 많이 먹어서 추억이 가득한 메뉴이기 때문이다. 보통 이삭토스트 타 매장들은 테이크아웃만 되는 곳들이 많아서 길에서 급히 먹을 수 밖에 없었는데 중랑역 이삭토스트는 홀이 있어서 좀 더 편하고 차분하게 음미하며 먹을 수 있었다. 시킨 메뉴가 나왔다. 물티슈와 냅킨을 같이 주신다. 이삭토스트의 비밀 병기는 아마도 버터와 안에 들어가는 계란 토핑이지 않을까 싶다. 언제 먹어도 맛있는 이삭토스트 어떤 식당을 가도 식비 만원은 기본인데 그 가운데에서 착한 가격으로 우리의 배를 ..

얼마 전 중국인이신 나랑 절친인 직장동료분과 저녁 식사를 함께 했는데, 우리나라에서 제육볶음과 같은 중국에서 흔한 음식이 향라육슬이라며 시켜주셨다. "고수 좋아하냐"고 물으시길래 나야 고수를 좋아하는 편이라서 (멕시칸 타코 좋아하고 베트남 쌀국수에 고수 조금 추가하는 편) "넵 처음 먹어보지만 일단 먹어보죠 뭐!!" 하고 쿨하게 먹어봤다. 결론부터 얘기하자면 완전 x 1000000 내 스타일인 대박 보물 메뉴를 발견한 느낌이라 이틀 후 근처 중식 맛집을 찾아 바로 복습하러 갔다 ㅋ_ㅋ 그 곳은 바로, 중랑구에서 핫플 중 하나인 중랑역에 위치한 '고려원양꼬치' 고려원양꼬치 서울 중랑구 중랑역로 18 (중화동 298-13) place.map.kakao.com 서울 중랑구 중랑역로 18 운영시간 13:00 -..

더글로리에서 송혜교(문동은)님과 김건우(손명오)님이 대화하는 장면을 촬영했던 곳! 바로 새암분식이다. 사무실 근처에 있어서 자주 오는 분식집인데, 메뉴를 시키면 기본적으로 오뎅국물을 주신다. 떡볶이는... 떡볶이 매니아 기준 인생 떡볶이 TOP 3 안에 든다. 쫄깃한 떡꼬치 떡을 쓰셔서 그런지 쫀득쫀득한 식감이 예술이다. 맵지 않고 달달한 맛이며 옛날 떡볶이 맛 그대로이다. 무엇보다 여기는 떡볶이도 짱이지만 국물이 최고 맛있다. 양은 1인분 치고 적당히 많은 편이다. 그래도 본인의 양이 큰 편이라서 떡볶이 1인분은 아쉬울 때 튀김 떡볶이 or 떡밥을 시키면 딱 알맞다. 떡밥은 떡볶이를 시킨 후, 1500원을 추가하면 이렇게 떡볶이 국물에 비벼먹기 위한 맛있는 밥을 만들어주신다. 비비면 이런 모양새가 되는..

앞서 석고보드 편에서 얘기를 못한 부분이 있는데 석고보드는 철거처럼 폐기물까지 버려주진 않는다. 순전히 기술과 자재비용이기 때문이다. 뭐... 비용 추가하면 됐을지도 모르지만.. 난 한 푼이 아쉬운 사람이니까! 남은 석고 자투리들은 마대자루를 구입하여 셀프로 처리했다. 석고보드에 칼로 칼금을 긋고 발로 눌러 툭 분질러주면 된다. 조심히조심히 하길 바란다. 그리고, 석고보드 자르면 석고가 우수수수 떨어지니 나중에 청소는 다시 빡세게 해야한다. 이제서부터는 진짜 내 몸뚱아리를 제대로 쓸 차례. 지옥이 시작되었다... 하지만.. 내가 벌린 일이니 즐거운 지옥(???)이었다. 앞날이 두렵기도 하지만 신나는... ㅎㅎ 나의 경우는 석고보드 -> 퍼티 -> 페인트 과정 중 석고보드만 전문가에게 의뢰했고 퍼티와 페인..

순서 실측 -> 철거 -> 곰팡이 제거 -> (전기시공) -> 석고보드 -> 퍼티 -> 페인트 -> 청소 -> 미장 -> 콩자갈 -> 집기 (각 단계별 소요 비용과 시간을 적어두겠다.) ※주의※ * 물이 많이 필요한 상업 공간에서는 석고보드 시공을 권장하지 않는다. 석고보드는 물에 약하다. * 석고보드는 이번 인테리어에서 가장 비용이 많이 드는 시공이지만 꼭 필요한 시공이었다. 그리고, 석고보드 다음은 석고보드끼리 이음새를 메꾸어주는 퍼티 작업을 해야한다. 나의 경우는 석고보드 -> 퍼티 -> 페인트 과정 중 석고보드만 전문가에게 의뢰했고 퍼티와 페인트는 셀프로 하였다. 그래서, 석고보드를 시공할때 즈음 페인트를 미리 주문해두는 것이 좋다. (최소 2-3일 소요) 나의 경우에는 페인트를 인테리어하는 친구..

앞서 철거를 마음에 들 정도로 했다면 도화지는 준비가 된 것이다. ...보통이라면 그렇겠지만 나는 아직 도화지를 더 만들어야 했다.  곰팡이가 심각한 곳이 있었기 때문. 석고보드를 벽 앞에 세워 깔끔하게 만들 예정이었으니 곰팡이 제거는 그 전에 해야했다. 완벽히 처리를 하지 않는다면 어디선가 정체 모를 악취가 지속적으로 폴폴 날 것이다. 곰팡이 제거는 약품을 이용하여 셀프로 진행하였다. 순서 실측 -> 철거 -> 곰팡이 제거 -> 석고보드 -> 퍼티 -> 페인트 -> 청소 -> 미장 -> 콩자갈 -> 집기 (각 단계별 소요 비용과 시간을 적어두겠다.) STEP 03. 곰팡이 제거 (약 2만원, 2일 소요) 윽 엨...ㅠ 다행히 이 부분만 심각했고 다른 부분은 곰팡이가 없었다. 곰팡이 제거를 해야한다..

나는 돈도 없고 가진게 내 몸뚱아리 하나라서 진짜 웬만큼 어려운 것 내가 혼자선 절대 불가하다 싶은게 아니면 모두 셀프 인테리어로 진행했다. 견적을 짠다고 해서 내가 뭐 계산기 탁탁 두들겨가며 엑셀에 쫙 정리하고 뭐 이런... 전문가처럼 절대 못 했고 꼼꼼한 그럴 성격도 못 되고.. 그냥 무작정 필요하다 생각하는 것을 하나 둘 스케줄 잡고 그 때 그 때 실행에 옮겼다. STEP 02. 실측 계약을 하고나서 며칠을 실측하고 확인했던 것 같다. 부동산에 들러서 키 받아간 것만 한... 대여섯번? 부동산이 열지도 않았는데 일찍 와서 대기타서 받아가고 며칠간을 오전 일찍부터 중개사님을 좀 많이 괴롭혔다. ㅎㅎ 실행했던 순서를 적어보겠다. 참고로 미리 얘기하자면 나는 숨고 어플과 네이버 인기통 카페를 적극 활용했..

약 5년 넘는 회사 생활에 지친 나는 나이 앞자리 3으로 바뀐 철이 없으면 안 되는 시기임에도 다시 과감한 도전을 한다. 2018년 경 해외직구 쇼핑몰을 투잡으로 나름 성공시켰던 경험을 발판삼아 다시 자영업에 도전한다. 모두 스톱하였다. 나쁘지 않았던 연봉, 안정적인 직장. "IT 직군이면 괜찮은거 아냐?" 괜찮긴 무슨... 나는 안 괜찮았다. 즐겁게 일하고 있다고 스스로에게 최면을 걸었을 뿐... 사실 정말로 좋아서 한 일은 아니었다. ... 아무튼 무모한 도전이다. 어쩌면 난 다시 회사원으로 돌아갈 수도 있다. 어떻게 될지 모른다. 글을 적고 있는 현재까지도 복잡한 머릿속 나는 어떻게 먹고 살 수 있을까 늘 고민과 걱정의 연속이다. 그럼에도 불구하고 마지막으로 무모한 도전을 했다. 이 글을 보러 들..

error warn Multiple Podfiles were found: ios/Podfile,vendor/bundle/ruby/2.7.0/gems/cocoapods-core-1.11.3/lib/cocoapods-core/Podfile. Choosing ios/Podfile automatically. If you would like to select a different one, you can configure it via "project.ios.sourceDir". You can learn more about it here: https://github.com/react-native-community/cli/blob/master/docs/configuration.md ✖ Installing CocoaPo..

fork와 call의 차이점은 무엇일까? fork는 비동기 함수 호출 call은 동기 함수 호출 call을 하면 logInAPI가 Return할 때까지 기다려서 Result에 넣어준다. 반대로, fork를 하면 요청 보내고 결과와 상관 없이 바로 다음 것을 실행해버린다. call인 경우에는 axios.then을 하는 것이다. yield가 await이랑 비슷하다. import { all, fork, call, put, take } from 'redux-saga/effects'; import axios from 'axios'; function logInAPI() { // Generator가 아니므로 * 붙이면 안 된다. return axios.post('/api/login') } // 요청이 성공/실패 할 ..

1. 1, 2, 4 차례로 나온다. generator는 yield가 있는 곳에서 멈춘다. = 중단점이 있는 함수 (done이 true가 될 때까지) generator를 쓰고, yield를 많이 넣어두면 next를 계속 쓰다가 next를 쓰지 않으면 멈출 수 있다. 2. Saga에는 무한루프가 다르게 동작한다. 무한의 개념을 사용하고 싶을 때 generator를 쓰면 된다. 이 성질을 활용하여 Event Listener와 같은 기능을 활용할 수 있다. g.next()가 어떤 특정 이벤트 때 상기 코드를 호출하게 되면 이것이 Event Listener이다. (= Generator를 활용한)

What is "Redux-thunk" 공식 문서에 나와 있는 설명 한 문장 Thunk middleware for Redux. It allows writing functions with logic inside that can interact with a Redux store's dispatch and getState methods. Redux를 위한 멋진 미들웨어입니다. 그것은 상호 작용할 수 있는 논리 내부의 쓰기 기능을 허용합니다. Redux의 Dispatch 및 getState 메서드를 사용합니다. + Redux-thunk와 Redux-saga는 둘 다 Redux의 미들웨어 라이브러리입니다. Redux 미들웨어는 dispatch()메소드를 통해 store로 가고 있는 액션을 가로채는 코드입니다. 쉽..

import { HYDRATE } from 'next-redux-wrapper'; // const initialState = { // name: 'hailey', // age: 29, // password: 'babo' // } // 6. 초기 데이터에 대한 구조를 잡아 두어야 한다. // initialState = 중앙저장소의 초기값 const initialState = { user: { isLoggedIn: false, user: null, signUpData: {}, loginData: {}, }, post: { mainPosts: [], } }; // 7. Login Action // data가 동적으로 바뀔 수 있도록 export const loginAction = (data) => { retu..

SELECT USER_ID, PRODUCT_ID FROM ONLINE_SALE GROUP BY USER_ID, PRODUCT_ID HAVING COUNT(*) >= 2 ORDER BY USER_ID, PRODUCT_ID DESC

-- 코드를 입력하세요 SELECT FACTORY_ID, FACTORY_NAME, ADDRESS FROM FOOD_FACTORY WHERE ADDRESS LIKE '강원도%' ORDER BY FACTORY_ID

-- 코드를 입력하세요 SELECT ANIMAL_ID, NAME, DATETIME FROM ANIMAL_INS ORDER BY NAME ASC, DATETIME DESC

-- 코드를 입력하세요 SELECT COUNT(*) AS USERS FROM USER_INFO WHERE DATE(JOINED) BETWEEN '2021-01-01' AND '2021-12-31' AND (AGE >= 20 AND AGE

$ git remote remove origin $ git remote -v $ git init $ git add . $ git commit -m "first commit" $ git remote add origin (url) $ git push origin main // 안 될 경우 git push origin +main $ git branch develop $ git checkout develop $ git branch -r $ git push origin develop

저자 켈리 최의 유튜브 영상을 여러 차례 본 적이 있다. 여자 혼자 프랑스에 가서 파리에서 '켈리델리'의 브랜드를 런칭하며 성공하신 분이다. 이 분은 유튜브 콘텐츠 소재가 다양한 사람들의 사연을 듣고 피드백을 해주시는 것이었다. 뜬금없지만 여기에서 '역행자'를 인용하지 않을 수 없다. 나의 시각을 바꾸어놓은 '역행자'에서 강조하는 부분 중 하나가 있다. 부자가 되고 싶다면 Giver(기버)가 되어라. 부자의 마인드는 사람 치고 밥값 내는 것에 인색하거나, 짠돌이처럼 굴지 않는다. 라고 얘기했다. 그 조언을 나도 깊게 새겨서 요즘에는 Giver가 되려고 노력한다. 아무튼, 갑자기 '역행자'를 인용하게 되었는데, 결론적으로 말하고 싶은 것은 '역행자' 자청과 '웰씽킹' 켈리 최의 마인드가 유사한 부분이 여기..

부의 추월차선 언스크립티드 이전 오리지널판인 부의 추월차선을 중간까지 읽었었다. 어떠한 계기로 중간까지 읽고 말았는지 모르겠지만, 아마도 읽다가 그냥 어떤 일 때문에 미루다가 못 읽게 되었던 것 같다. 언스크립티드 버전을 먼저 읽고, 그 책을 다시 읽어보려고 한다. 저자인 엠제이 드마코는 '이 책이 당신의 삶을 바꾸는 것을 당신이 허락할까?'로 서두를 뗀다. 이 책의 제목인 unscripted(각본대로 하지 않는), 즉 지구상의 나머지 인간들과 달라지기 위한 목적이다. 본인이 오랫동안 기업가를 꿈꾸어 왔다면, 언스크립트는 나의 책이라고 저자는 말한다. 그러나, 정작 변화를 선택하는 사람은 극소수다. 저자는 이 책을 통해 불편한 진실, 관습에 대한 도전, 사람들을 불편하게 하는 폭로를 말하고자 한다. 저자..

권투 선수가 운동을 해서 '신체 최적화'를 이뤄내면 그것으로 평생 돈을 벌며 살듯이, 인간 또한 한 번 뇌를 최적화해두면 일 평생 앞서나갈 수 있게 된다. 우리의 뇌는 복리로 지능이 발달하기 때문에, 최적화를 해둔 뇌는 날로 뇌가 업그레이드 되면서 나이를 먹을수록 오히려 강력해진다. 한 살이라도 어렸을 때 이것을 시작했다면, 50~60대에는 그야말로 뇌로부터 오는 자동 수익을 얻을 수 있는 것이다. '뇌의 복리' 이 개념이 어렵다면 좀비를 생각하면 된다. 처음에는 원금 혼자 이자(좀비)를 낳는데, 두 번째부터는 그 좀비가 다른 좀비들을 낳고, 그 좀비들이 또 다른 좀비들을 낳는다. 다시 말해, 머릿속에 새로 들어온 지식이 좀비가 돼서 다음 지식을 전염시키고(흡수하고), 다시 그 다음 지식을 전염시키는 과..

역행자, 이 책을 1번 완독 후 다시 2번째에 읽으니 확실히 머리에 각인이 잘 되었고 역행자 단계를 누가 물어본다면 읊을 수 있게 되었다. 이 전에 독서를 할 때에는 책을 덮음과 동시에 잊어버렸다. 마치 어제 먹었던 점심 메뉴가 기억이 나지 않았던 것 처럼 말이다. 그리고, 본인은 원래 한 번 했던 것을 다시 하는 것이 싫었다. 이미 알고 있는 걸 뭘 또 해? 라는 오류에 사로잡혔던 것이다. 이제는 똑같은 것을 반복해서 하는 것에 거부감이 없을 것 같다. 확실히 똑같은 것을 두 번째 봤을 때는 또 다른 배움이 있다. 이번 Chapter 4에서 말하는 역행자 3단계, 유전자 오작동은 '클루지'가 많이 언급된다. 예를 들어, 나방의 경우 빛을 향해 일정한 각도로 나는 특성 때문에, 점점 불을 향해 날아가는 ..

자의식 해체가 몸에 익었다 싶으면 다음 단계로 가보자. 바로, '정체성 만들기'이다. 보통 자기계발서를 보면 드라마틱한 스토리로부터 자수성가가 된 케이스가 많다. 그러나, 일반적인 사람들은 있지도 않은 일을 만들어서까지 흙수저에서 다이아몬드, 금수저가 되는 스토리를 만들기 쉽지 않을 것이다. 그래서 역행자에서 서술하는 것은, 사소한 것이라도 좋으니 자신의 이야기를 만들어 정체성을 확보하는 것을 중요하게 생각한다. 다시 말해, 정체성을 바꾸는 사건을 인위적으로 만들어내도 좋으니 나의 이야기를 대사건으로 만들어보자는 뜻으로 이해했다. 어찌보면 이는 강한 동기부여를 하라는 말과 같다고 생각한다. 정체성을 바꾸는 것은 즉, 환경을 만드는 것이고, 정체성을 바꾸면 변화는 쉽게 찾아온다. 정체성은 곧 삶의 동기이다..

이 책에 감명을 받아 1번 빠르게 속독 후, 자청님께서 말씀하신 독서법을 적용하여 2번째로 다시 읽어보고 있다. 책을 많이 읽는 것이 중요하다는 것은 명백한 사실이다. 하지만, 책을 아무리 많이 읽어도 저자가 뭔 말을 했는지 기억이 안 나고 그러다보니 당연하게도 내 인생이 변하지 않는 것을 깨닫게 되면 정말 좌절스러울 것 같다. 나는 무엇을 하더라도 효율적으로 해야한다고 생각한다. 속히 말하는 '삽질'을 매우 싫어한다. 그런 '삽질'을 하지 않기 위해 자청님의 독서법이 아주 와닿았다. 여태껏 나는 책을 읽더라도 닥치는대로 읽고 나중에는 까먹었다. 혹시나 나중에 이 책을 읽을 사람을 위해 괜한 배려랍시고 책에 메모, 형광펜칠도 잘 하지 않았다. 물론, 책을 어느정도 주기적으로 읽으며 독해력이나 문해력은 확..

점심시간에 잠깐 틈내서 읽은 것이라 보수적으로 정리하기는 어렵다. Chapter 6 후반에 나온 것 처럼, 블로그에 간단한 글을 적기 위해 아주 빠르게, 간단하게, 독후감을 적겠다. 나는 제어 장치가 고장나서 실행력이 좋은 사람에 속한다. 고등학교때 학교를 그만두고 스타일난다 대표를 동경하여 첫 번째 쇼핑몰을 창업해보았고, 대학교때 고등학교때 못 다한 학창시절을 열심히 보내고 싶어서 반대표부터 학회장까지 리더 역할을 대학생활 내내 하였고 넓은 세상을 보고 싶어서 대학교 휴학을 하고 미국에 계신 고모를 보러 날아가서 혼자 여행을 했고, 영어가 너무 좋아서 무역회사에 인턴으로 취업했고, 더 안정적으로 돈을 벌고 싶어서 이력서를 내고 조기 취업을 해서 돈을 벌었다. 콘텐츠 디자인과 콘텐츠 마케팅을 했던 당시 ..

2022-06-26 처음 ~ 79page 이 책의 저자는 현경민 KT AI 사업본부에서 일하고 있으며, IT 전문 포럼 커넥팅랩을 이끌고 있다. 첫 챕터는 메타버스에 대한 주제로 시작 되었는데, 현재 인공지능 석사 과정을 밟고 있는 나로서 흥미가 가는 대목이었다. Chapter 1에 들어가기 앞서, Chapter 0으로 펜트업 트렌드에 대해서 먼저 짚어주었다. 그 중에서 몇 가지만 읊어보자면 펜트업 트렌드 첫째, 디지털 사피엔스로 진화한 4050을 잡아라. 코로나 이전에는 2030 소비자들을 타겟으로 잡아 젊은이들의 시선을 끌려는 노력들이 주가 되었었다. 그러나, 현재의 트렌드는 조금 달라졌다. 왜냐하면, 상대적으로 여유가 있는 405060 여성들이 2030에 비해 더욱 소비가 크며, 이들이 디지털과 친..

일하다가 머리가 너무너무 아파서 가볍게 하는 포스팅. 요즘 다이어트중이다. 그렇게 스트레스 받으면서 하는 건 아니고, 점심값 아낄겸 윙잇에서 시켜먹은지 2달째. 어제(현충일, 6월 6일) 쉬는날에 시켰는데 어김없이 새벽 배송이 왔다. 국뽕이 차오르는 새벽 배송 수준이다. 어떻게 이렇게 빠르게, 친절하게 가져다주실 수 있지? 시간을 보자. 오전 3시...... 와....................... 내 한달치 점심 식량이다. 늘 회사에서 도시락으로 먹고 있고, 질리지 않게 다양하게 시켰다. 이것이 5만 1천원 어치 정도이다. 리스트는 나열하기 귀찮으니... 대충 내부 컷을 보여드리겠다. 매우매우매우 꼼꼼한 포장,, 게다가 친환경적인 종이 포장! 아주 잡다하게 시켰쥬..? ㅎ..ㅎ~ 질리지 말라구~ 잡..

(인스타 스토리에 올리느라 세로 사진이 좀 많네...) 능력자 지인의 찬스를 빌어 좋은 기회로 방문하게 된 시티 포레스트! 노들섬에서 진행되었다. 하루종일 운동하는 프로그램으로 구성되어 있는데, 활동적인걸 좋아하고 마침 다이어트중이었던 나에게는 설렘 가득한 소재의 페스티벌이었다. 코로나 시국이 끝났다는 실감이 유독 진하게 느껴진 이번 시티 포레스트. 나는 일요일 하루 1시부터 4시정도까지 참여했던 것 같다. 티켓 부스에서 입장 처리를 하고 선물 교환권을 받고, 교환 부스에 갔는데 거대한 쇼핑백에 담긴 엄청난 양의 선물들... 무엇이 들었나 슬쩍 볼까? 별게 다 있다. 이렇게 보면 잘 모르니, 집에가서 테트리스 하듯 정리해봤다. 어.. 진짜 너무 많잖어.... 이렇게 퍼줘도 됩니까 이거 남는거 뭐 있슴까?..

List 객체를 새로 생성하여 Object 객체를 add해주는데 자꾸 마지막으로 돌은 Object 객체의 데이터로만 list에 담기는 문제이다. 수정된 코드는 다음과 같다. 예전에 해결해본적 있었는데 또 까먹었었음. List를 초기화하면서 삽질을 30분정도 했는데 결론적으로, 새로 담을 객체를 반복문 내에서 새로 선언해주어 메모리 주소를 새로 할당해주어야 하는 것이었다. 어떤 블로거의 예시에 의하면, 아이를 한 명만 낳았는데 이름은 3개 지어서 우겨 넣으니 맨 마지막 이름이 그 아이의 이름이 된 꼴이 된 것이다. 나는 list를 초기화해줬던 것이 그 1명의 아이를 계속 초기화 해줬던 것임. 결론 : list 내에 넣고자 하는 '객체'를 새로 생성해주세요.

Camera Calibration(카메라 캘리브레이션) 이란? 기하 카메라 보정은 카메라 절제(camera resectioning)라고도 하며, 영상 또는 비디오 카메라의 렌즈 및 영상 센서에 대한 파라미터를 추정합니다. 이러한 파라미터를 사용하여 렌즈 왜곡을 수정하거나, 세계 단위로 객체의 크기를 측정하거나, 장면에서 카메라의 위치를 결정할 수 있습니다. 이러한 작업은 객체를 검출하고 측정하는 머신 비전과 같은 응용 사례에 사용됩니다. 또한 로보틱스, 내비게이션 시스템 및 3차원 장면 복원에도 사용됩니다. 카메라를 보정한 후 수행할 수 있는 작업의 예는 다음과 같습니다. 카메라 파라미터로는 내부 파라미터, 외부 파라미터, 왜곡 계수가 있습니다. 카메라 파라미터를 추정하려면 3차원 세계 점과 그에 대응되..

안녕하세요, 헤일리입니다. 회사와 대학원을 병행하는 정신없는 요즘, Ahㅏ... 갈수록 저질 체력이 되어가는 내 모습을 보니... 도저히 안 되겠다 싶어서... 체력 관리를 위해 운동을 찾아보다가 우연히 찾게된 필라테스!!! 아무래도 내근직 직업 특성상, 자세 틀어짐으로 인해 목디스크와 어깨, 골반 교정을 늘 염두해두고 있었는데 마침 집과 가까운 오리역 근처에 물리치료사 출신의 필라테스 선생님께서 계시다는 소문을 듣고, 믿고 제 자신을 맡겨보게 되었어요!!! 처음 들어가자마자 완전 인테리어 너어어어무 세련되고 예뻐서 반했어요... 샹들리에 무엇.... 모야 모야...... 저 이런 여자여자한 운동 처음이거든요..... 사실, 저는 핫요가를 하다가 마지막즈음 코를 골며 골아떨어진 기억이 있어서 약간 얌전한..

도커 볼륨의 역할 => 컨테이너가 날아가더라도 볼륨은 유지가 된다. uploadVol:/upload 볼륨 이름 :/ 컨테이너 경로 172.17.0.2:8080 volumn에 들어간 파일은 어디에 있을까? docker volume inspect uploadVol 명령어 Mountpoint 경로에 파일이 존재함을 알 수 있다. 볼륨을 왜 쓸까? 볼륨 리소스를 만들어놓으면, 컨테이너를 여러개 만들고 여러개의 컨테이너들이 이 볼륨을 같이 마운트 시키면 볼륨을 공유파일 시스템처럼 쓸 수 있다. [ 데이터 전용 컨테이너 사용 ] 컨테이너는 Create만 하고 run을 할 필요가 없음. 하지만 볼륨을 가지고 있는 상태에서, 볼륨을 쓰도록 Create만 해놓는다. 그리고, 공유 스토리지가 필요한 Container를 실..

믿고 써도 되는 애들도 있음 Repository에 개인이 작성해서 Push를 할 수도 있음 가입해보자 도커 이미지 관련 명령어들 컨테이너를 실행을 시켰다는 전제를 두자. 파일을 Container 안에서 추가, 삭제 작업을 한다. 그리고 Commit 명령어를 내릴 수 있다. 변경된 라이터블 레이어들이 readonly 레이어로 쌓이면서 우리만의 이미지로 쌓일 수 있다. 만들어진 이미지를 tag만 바꿔 달때, docker image tag 명령어를 쓴다. docker save, load, import, export를 사용할 수도 있음. ( 별로 사용 많이 안 함) 최종적으로는 Docker File을 가지고 Docker 이미지 빌드 명령으로 이미지 만드는 것을 할 수 있음. 오늘은 commit까지만 해볼 예정...

안녕하세요, 헤일리입니다. 원서비를 대략 60만원(ㅠㅠ) 쓰고, 다행히 원하는 곳에 합격하여 인공지능 특수대학원을 찾는 누군가에게 도움이 되길 바라는 마음에 이렇게 블로그에 글을 적게 되었습니다. 참고로 저는 현재 개발자 직군에 종사하고 있으며, 인공지능에 대한 지식은 별로 없는 상태에서 지원했습니다. 하지만, 내가 이만큼 대학원에 가기 위해 노력했다는 것을 조금이라도 증명하기 위해 기초적인 관련 지식들을 공부하고 자격증 1개(Tensorflow Developer Certificate)를 취득한 상태로 면접을 봤습니다. 지금 드는 생각이지만... 좀 더 공부하고 면접 볼 걸... 이라는 후회가 듭니다. 지금은 질문에 다 구구절절 대답할 수 있을 것 같은데 말이죠 ㅠㅠ 아무튼, 9개 대학을 지원해서 (성균..

1. 버블 정렬이란? 인접한 두 항목의 값을 비교해서 일정한 기준을 만족하면 서로의 값을 교환하여 정렬하는 방식 # Python 코드 import unittest def bubblesort(alist): for i in range(len(alist)-1): for j in range(len(alist)-1): if alist[j] > alist[j+1]: alist[j], alist[j+1] = alist[j+1], alist[j] return alist class unit_test(unittest.TestCase): def test(self): self.assertEqual([1, 2, 3, 4, 5, 6], bubblesort([4, 6, 1, 3, 5, 2])) self.assertEqual([1,..

스위치 장비의 예전 이름이 브릿지였음. 리눅스 OS를 깔고 스위치 역할을 할 수 있음. 리눅스 브릿지 기술을 이용해서 네트워크 격리를 하는 것임. 랜선을 하나 만들고, 링크 쌍을 만들어서 ip 쌍을 만들고 네트워크 연결 할 것임. Control Groups Linux Kernel에서 제공하는 기능 리눅스 커널에서 특정 프로세스 하나에게 CPU 몇 코어만 써, 메모리는 1기가만 써, 어떤 디바이스는 쓸 수 있고 없고를 제어해주는 것이 Control Groups이다. Docker Container는 Linux 커널의 입장에서 1개의 프로세스일 뿐이다. 기본적으로 리눅스 OS는 프로세스가 요청하는 자원들을 계속 준다. Docker Container를 운영하다보면, 특정 컨테이너가 자원을 독점해버릴 수 있기 때..

로그인만 console에서 해주고 mobaXterm 접속 newroot로 파일 시스템이 격리 됐음 완전히 격리된 root를 제공해주고 있음. 리눅스 커널의 namespace 기능으로 특정 프로세스에게 이러한 기능을 지원한다. namespace라는 개념은 사실 아주 광범위한 단어이다. 쓰이는 문맥에 맞게 해석을 해야하는데, 쿠버네티스의 namespace 리눅스 커널의 namespace 그 외 Language별로 (JAVA 등)의 namespace 등등 무언가 격리를 해주는 느낌의 단어이다. UNSHARE 명령 run program with some namespaces unshared from parent unshare -m 명령을 사용하여 mount namespace를 격리 -m : 마운트 마운트라는 개념..

도구 -> 네트워크 선택 이제 머신 -> 추가 -> 파일 추가 저기 줄 3개짜리 클릭해서 스냅샷 클릭 확인하기 시작 클릭하면 VM intro가 뜨면서 요렇게 나옴 root / edu 로그인 후 ping 테스트까지 완료

1. 정의 결정 트리 분류기 는 분류 문제에 사용되는 간단한 기계 학습 모델이다. 분류에 사용되는 가장 간단한 기계 학습 모델 중 하나이지만 제대로 수행되고 우수한 교육 데이터가 있으면 일부 작업을 해결하는 데 매우 효과적일 수 있다. Decision Tree Classification A Decision Tree is a simple representation for classifying examples. It is a Supervised Machine Learning where the data is continuously… medium.com The Basics: Decision Tree Classifiers An intuition for how decision trees work and are bu..

회사 홈페이지를 만든 후, AWS로 배포를 하게 되었다. 소요 시간은 도메인을 미리 사뒀다는 전제하에 삽질 포함 정확히 이틀정도 걸렸음. 또 하라하면 도메인이 바로 적용된다는 전제하에 반나절 컷 가능할듯 ㅋ 아무튼 블로그에 쓰는건 추후 배포할 때 까먹지 않기 위해 하는 기록임 AWS에 배포를 한다는 의미는 아주아주 쉽게 얘기해서 "가상 컴퓨터를 AWS(클라우드)에 만들고, 해당 가상 컴퓨터에 나의 프로젝트를 저장시킨 후 서버를 자동으로 가동시켜주며 도메인과 연결해주는 네임서버를 발급해줌" 이다. 나는 멍충이라 이걸 이해하는데에 꽤 많은 시간이 걸렸다...ㅋㅎ 로그인하면 다음과 같은 화면이 뜬다 왼쪽 상단 서비스에 들어가서 EC2 클릭 인스턴스 시작 클릭 여기서부터 좀 갈리는데 프리티어인 Amazon Li..

안드로이드 인스타그램 클론 코딩 중. 1. Firebase 연동 완료 2. LoginActivity.kt에 Firebase Email 및 Password 처리 로직 작성 package com.hs.howlstagram_f1 import android.content.Intent import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import android.widget.Toast import com.google.firebase.auth.FirebaseAuth import com.google.firebase.auth.FirebaseUser import com.google.firebase.auth.* import kotlinx.and..

Class를 import 해오고 싶은데, import가 안 될 때? kotlin-android-extensions을 build.gradle(Module)의 plugins에 추가해준다. 1. bulid.gradle에 들어가서 2. kotlin-android-extensions 플러그인 추가 3. 사진에 표시된 Sync Now 클릭 import kotlinx.android.synthetic.main.activity_login.* 를 사용할 수 있게 되었고, 원래 import 되지 않아서 빨간색이던 변수가 정상적인 컬러(?)로 돌아온당 ㅠㅠ

Ahㅏ... 엄청난 삽질 끝에 갓 블로거님의 글을 발견하여 ... 쉽게 해결하였습니다. 너무 감사합니다. ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ SHA1 값을 조회하기 위해 인터넷에 검색한데로 Gradle view 목록에 있는것들중 signingReport 를 실행할려고 했는데 아무리 봐도 그런게 안 보였다. 검색해 보니 4.2 로 업데이트 되면서 성능상 문제라나 뭐라 그래서 디폴트로 안보이게 처리를 했다고 한다. 뭔 이유가 있어서 안보이게 했겠지만 굳이 다시 보이게 하고 싶다면 File - Settings - Experimental 에 가서 Do not build Gradle..

자, 이제 어느정도 데이터가 이런식으로 굴러가는구나~~ 느낌이 왔으니, 이제 데이터에 조작을 좀 해보겠습니다. 이상치를 제거해보려고 하는데요. 이상치 제거 전과, 제거 후 사이의 값 갯수가 약 150개? 정도 차이가 나죠 근데 아웃라이어 제거(=시그마 이상치 제거; Remove Outlier Data)가 뭔데..? 뭐야... 말이 왜이렇게 어려운데?!?!?! 이 기술은 케글(Kaggle)에서 상위 랭크로 올라가려면 꼭 필요한 기술 중 하나라고 하네요. 그래서 저도 공부해보았습니다. ■ 데이터 이상치 탐지(Data Outlier Detection) 말 그대로 이상이 있는 데이터를 뜻합니다. 일반적인 데이터 패턴과 다르게, 매우 이상한 패턴을 가지고 있는 데이터를 뜻합니다. 머신러닝과 딥러닝에서는 이러한 이..

데이터들을 년, 주, 월로 시각화해서 봅시다. 맨날 이렇게 치기 귀찮으니까, 함수 만들어서 간단하게 파라미터로 데이터만 넣어주는 방법도 있다.