여씨의 개발이야기

최근에 지인에게 프로그래밍을 하는데 Context라는 말이 너무 추상적이어서 이해를 못 하겠다는 질문을 받았다. 어영부영 "어떠한 행위를 할 때 필요한 정보"라고 설명을 해줬지만 프로그래밍을 처음 접하는 지인에게는 이것 또한 상당히 막연하고 추상적인 개념인 것 같았다. 그래서 좀 더 찾아보고 설명해주고자 구글링을 했는데 정말 어썸(ㅋ)한 설명을 stackoverflow에서 발견했다. https://stackoverflow.com/questions/6145091/the-term-context-in-programming/28073970 The term "Context" in programming? I have been programming for some months now and a frequently u..

최근에 면접을 보러다니면서 가장 현타오고 자괴감 들던 것이 내가 사용하는 주력 언어에 대한 워크 플로우를 완벽하게 정리하여 타인에게 설명하는 것에 대한 실력이 부족하다는 것이었다. 하지만 자괴감이라는 감정에 굴복하지 않고 앞으로 나아가는 사람이 되기로 했으니까, 면접을 보고 난 뒤에는 꼭 복기를 하리라 다짐을 했다. 나의 주력 언어는 java 그리고 jsp이다. 요즘에는 프론트엔드에 관심이 생겨 react나 vue.js 스터디를 하고 있지만, 그래도 당신이 자신 있는 언어가 뭡니까? 라는 질문을 면접 중에 받게 된다면 주저없이 java와 jsp를 답 할 것이다. 그렇게 익숙한 언어였지만 놀랍게도 workflow를 설명하라는 문제에 답을 하지 못 했다. 이후 '시키는 대로 구현하면 되지'라는 안일한 생각으..

index.js 파일 var express = require('express'); var path = require('path'); var router = express.Router(); router.get('/', function (req, res) { res.send({ greeting: 'hihinode' }); }); router.get('/getFileList', function (req, res) { const fs = require('fs'); const dir = './public/template'; const folders = fs.readdirSync(dir).filter((f) => fs.lstatSync(path.join(dir, f)).isDirectory()); var cardA..

소스 정리 및 비교, 최적화 : https://prettydiff.com/?m=beautify Pretty Diff - The difference tool ↑ ↑ ↔ prettydiff.com 한글화되어있는 사이트인데 미리보기 화면으로 소스 정리할 수 있는 사이트 : http://html.segio.com/ko/ HTML 소스 태그정리 (segio.com) 대상 작업 (속성, 태그, 여백)을 선택한 후 아래에서 제거하십시오. 추가할 내용은 콜론으로 구분하여 입력하세요. 태그 삭제시 "!--/--"의 의미는 " " 태그를 의미합니다. html.segio.com 심플한 HTML, CSS 정리 사이트 : https://tools.arantius.com/tabifier Tools - Tabifier (HTML ..

텍스트 파일 읽기 const fs = require('fs'); const text = fs.readFileSync("source.txt"); const textSplitArr = text.toString().split('\n');//띄어쓰기로 나누고 싶을 때는 텍스트 파일 쓰기 const fs = require('fs'); const text = 'UTF-8로 저장될 텍스트'; fs.writeFileSync("target.txt", '\ufeff' + text, {encoding: 'utf8'}); 참고로 Node.js는 파일을 저장할 때 기본적으로 BOM 정보를 저장하지 않기 때문에 \ufeff를 텍스트에 앞에 명시해줘야 함.

📢 이 오류 좀 보세요! 필자는 vscode에서 spring boot dashboard를 사용중이다. 현재 Java + Vue 프로젝트를 제작하고 있는데, 프로젝트명이 바뀌면서 전체 파일들과 폴더부터 시작해 변수 prefix까지 이름을 바꿔야 할 일이 생겼다. 바꾸는 도중에 갑자기 해당 프로젝트가 spring boot dashboard에서 사라져버렸다. 🐞 오류가 나타난 이유? spring - maven 프로젝트는 또 안에 자식 프로젝트가 여러개가 있을 경우 pom.xml의 groupId로 프로젝트들을 그룹핑한다. 그런데 필자는 파일들마다 특정 텍스트를 바꿨는데 groupId도 예외였을까? 물론 아니다. 🕸 어떻게 이 오류를 잡을까? 결론적으로, parent의 groupId, 해당 프로젝트의 groupI..

JS 강의를 듣는 도중에 나온 "Syntactic sugar". 직역하자면 문법적 설탕. 말 그대로 정말 달달하고도 매혹적인 놈이다ㅋ 정의를 내려보자면, 사람이 이해 하고 표현하기 쉽게 디자인된 프로그래밍 언어 문법. 또는 프로그래밍 언어를 더욱 더 간결하고 명확하게 표현이 가능하도록. 즉, sweeter하게 사용 할 수 있도록 도와주는 문법을 "Syntactic Sugar"라고 한다. In computer science, syntactic sugar is syntax within a programming language that is designed to make things easier to read or to express. It makes the language "sweeter" for human..

프로그래밍을 하면서 내가 제일 싫어하는 부분 또 또 나왔다... 일상에서도 시간 계산을 못 해서 그런 지(?) 개발을 할 때도 동기, 비동기 순서 이런 거 나오면 딱 질색이거등요... 그래도 엘리쌤 JS 강의 덕에 이전에 배웠던 동기와 비동기에 대해 복기하며 이해를 조금씩 하고 있었는데, async와 await 강의를 듣는 순간부터 멍때리는 시간이 많아졌다. promise? 그래 너. promise라는 클래스 너 이놈, asynchronous operation(: 비동기 연산자) 이라는 건 잘 알겠어... 안에서 이루어지는 작업이 성공 할 경우에 resolve, 실패할 경우에는 reject를 반환한다는 것도 okok,, 잘 알겠어. 대충 후속 처리 메서드(promise.then(...).catch(.....

🕵️ 디자인 패턴이란 ? 소프트웨어 디자인 패턴은 소프트웨어 공학의 소프트웨어 디자인에서 특정 문맥에서 공통적으로 발생하는 문제에 대해 재사용 가능한 해결책이다. 소스나 기계 코드로 바로 전환될수 있는 완성된 디자인은 아니며, 다른 상황에 맞게 사용될 수 있는 문제들을 해결하는데에 쓰이는 서술이나 템플릿이다. 즉 '효율적인 코드를 만들기 위해 등장한 방법론'이라고 생각하면 되겠다. 소프트웨어 디자인 패턴 - 위키백과, 우리 모두의 백과사전 소프트웨어 디자인 패턴(software design pattern)은 소프트웨어 공학의 소프트웨어 디자인에서 특정 문맥에서 공통적으로 발생하는 문제에 대해 재사용 가능한 해결책이다. 소스나 기계 코드로 바로 ko.wikipedia.org 이번 시간에는 아주 다양한 디자..

보통 우리는 같은 사이트 내에서 다른 페이지로 이동하고자 할 때는 아래와 같이 라우터를 이용해서 redirect하는 방식을 이용한다. this.$router.push("/about"); 하지만 우리가 알아보고자 하는 방법은 같은 사이트 내부가 아닌, 외부 URL을 redirect하는 것이다. 아래의 소스를 보겠다. 해당 소스는 vue앱에 /contact 경로가 있다고 가정할 때, 사용자가 /contact 페이지를 접속할 경우 외부 url인 https://www.google.com/contact/ 페이지를 접속하고자 한다. 가장 쉬운 방법으로는 /contact 와 연결된 소스에 window.location.href 속성을 사용하면 된다. Contact.js Contact Page 위의 소스에서, creat..