본문 바로가기

분류 전체보기283

Vue Project 생성하기2023 (M1, CLI, UI, Vite) 일단 난 M1 Mac을 사용하고, homebrew를 이용해서 진행할 것이다 Node.js를 설치한다 ⇒ 생략 Vue CLI (Command Line Interface) 설치 sudo npm install -g @vue/cli 1. Vue-CLI default 프로젝트 생성 #vue create [프로젝트명] vue create vue-default 버전 선택 Vue3 프로젝트 매니저 도구 선택 NPM or Yarn Yarn 선택 완료 실행 테스트 # cd [프로젝트명] cd vue-default yarn serve http://localhost:8080 접속 터미널 실행 종료 Ctrl + C - 프로젝트 구조 .idea node_modules public public/favicon.ico public/i.. 2023. 1. 11.
M1 Mac Flutter 앱 만들어보기(feat. homebrew) Cross Platform Dev(IOS, Android) - Flutter의 장점 Flutter는 실제 Native Code로 컴파일하며 크롬이 사용하는 렌더링 엔진(스키아-Skia)을 사용하므로 실행 시 다트를 변환하지 않는다. 즉 사용자의 디바이스에서 플러터 앱을 실행하면 성능이나 생산성이 저하되지 않는다 Flutter는 JavaScript가 아닌 디버깅이 용이하고 컴파일 타임이 빠르다 brew 설치는 생략 [brew로 설치를 하지 않으면 bash shell 실행 PATH를 등록해줘야 하기때문에 귀찮다] 윈도우의 PATH 설정과 비슷한 개념이다. 리눅스나 맥도 터미널 전역에서 명령어를 입력해서 실행하려면 bin 폴더를 경로로 잡아줘야 한다 - 기본G식 brew install flutter 난 이전에.. 2023. 1. 9.
네이버 클라우드 써밋 립스탑백 후기 내가 총 300명 안에 든건지는 모르겠는데...진짜 열심히 참여했다..ㅎㅎ결국!!가방 받았다 ㅎㅎ 손잡이 부분에 네이버 클라우드라고 자수로 되어있고, 안에는 자크로 잠글 수 있게 되어있고 작은 수납공간 하나가 존재했다dev랑 관련된 가방으로는 원티드 뉴 스타트 패키지에 있는 가방을 매우 유용하게 쓰고 있는데,비교를 하면... 원티드 가방이 좀 가죽느낌에 짱짱한 재질이다 이 네이버 클라우드 가방은 하늘하늘한(?) 느낌이다두께가 좀 얇다대신에 맥북프로 16인치를 넣으니깐원티드 가방은 버거워하는 느낌이 있었는데 얘는 넣고도 충분하다..!이 네이버클라우드 장점은 손잡이에 네이버 클라우드 자수... 내가 뭔가 초록집 다니는 느낌이쟈나....ㅎ근데 가방이 얇은편이라 나는 그렇게 잘 들고다니진 않는거같다 기분전환용으.. 2023. 1. 9.
Slack 채널에 메세지 보내기 2023년 (Spring, Js) 1. 슬랙에 가서 자신만의 워크스페이스를 만든다 2. 메세지를 보내고 싶은 채널을 만든다(optional) - 기본 채널로 써도 됨 난 로그인을 하면 로그인한 사용자의 간단한 정보를 슬랙으로 보내고 싶기때문에 채널 이름을 auth로 설정함 사용자 추가는 건너뛰기를 하였다 3. 채널 이름(# 채널이름)에서 아래를 가리키는 화살표 토글 버튼을 누른다 4. 통합 탭으로 눌러서 앱 -> 앱 추가를 누른다 5. 수신 웹훅(Incoming WebHooks)를 추가한다(보기->슬랙에 추가) [ 웹으로 열린다 ] 6. 전송 보낼 채널을 선택한다 7. 웹후크 URL을 복사한다 아래에 메세지전송, 링크추가, 사용자 지정 아이콘, 채널 재정의, curl 요청 등 어떻게 보내는지에 대해 자세히 적혀있다 8. 알림 올 이름을 .. 2023. 1. 8.
IntelliJ Honey Tips 5 - 단축키 모음 이번 5번에서는 단축키로 돌아왔다 인텔리제이를 잘 쓰려면 단축키와 여러 기능들 또한 알면 좋다 오늘은 나름 꿀팁들을 몇개 또 들고 왔다 현재 파일에서 변수/메서드 검색: Cmd + F12(윈도우는 컨트롤 + F12) 구조(structure) 보기: Cmd + 7 (위와 비슷하다. 하지만 더 강력하다. 프로젝트 구조도 볼 수 있고 메서드 단위로 점프 뛰며 이동할 수 도 있다) 모든 메서드 및 javadoc 줄이기(collapse): cmd + shift + +/- 해당 위치의 접은 코드 늘리기(expand) : cmd + +/- => 로직이 복잡할때 모든 메서드를 줄여놓고 cmd + 7으로 메서드를 찾아가서 작업하면 눈도 머리도 안피곤함! 최근에 정말 복잡한 3000줄 이상의 .ts파일에서 LifeCycl.. 2023. 1. 5.
2.n년차 주니어 개발자의 2021~2022년 회고 with 노트 2023년 1월 1일이 되고도 벌써 4일이 지나서 5일이 되었다..!!!2022년은 나에게 여러가지 감정을 느끼게 하는 한 해였다2020년 초에 짧막한 계약직을 시작으로(이후 내가 정규직 요청 거절)2021년부터 2021년 12월까지 정말 부단히도 달렸다알고리즘 공부/스터디, 스프링 스터디, 팀 프로젝트, 공채/인턴/상시 모집 지원 등등...이 모든게 두 권의 노트에 담겨 있고, 채워 나가는 중이다(하트)약간 때를 거슬러 올라가 2021년도 취준때부터 얘기하면 좋을 것 같다아래 내용이 뭔지 정확히 기억은 안나지만.. 대학생 후배들 과제 도와줬던 것 같다요즘은 파이썬부터 배우고 C를 배워서 포인터를 모르거나 헷갈려하더라. 안헷갈려하는 친구들도 있는것 같지만..나름 C수업은 A+를 받았기도 하고 3, 4학년.. 2023. 1. 5.
Semicolon auto disable in IntelliJ(Js/Ts) 자바스크립트나 타입스크립트 언어의 특징은 1. 끝에 세미콜론(;)이 있든 없든 에러가 아니다 2. 리스트나 객체의 끝에 ,가 있어도 에러가 아니다 3. 문자열로 '', ""둘다 허락한다 1. const test = '123'; const test = '123' 2. const arrTest = [1, 2, 3, 4, 5,] const arrTest = [1, 2, 3, 4, 5] let t2 = {age: 25, height: 180, grade: 'A',} let t2 = {age: 25, height: 180, grade: 'A'} 3. const hello='hello' const hello="hello" 나는 끝에 세미콜론을 붙이지 않는 것을 선호한다 또한 자바스크립트나 타입스크립트는 [1,2,3.. 2022. 12. 8.
IntelliJ에서 Vue.js프로젝트 만들기 사실 프론트엔드분들은 VScode -> WebStorm 순으로 IDEA를 많이 쓸 것 같지만 나는...쪼렙 초보이기때문에 IntelliJ로 프론트를 개발한다(사실은 회사에서 인텔리제이 라이센스만 줘서.. + 내 돈으로 웹스톰 결제하기 싫..ㅋㅋ) 그래서 인텔리제이로 뷰를 공부해보려고 한다 내 인텔리제이 버전은 2022.4 Ultimate Edition이다 기본적으로 인텔리제이에서 새 프로젝트를 만들면 뷰 프로젝트가 안보인다 아마 내 기억으로 WebStorm은 뷰 프로젝트가 있던 것 같다 그럼 인텔리제이는 어떻게 해야하나..? 일단 플러그인에서 Vue.js 플러그인을 검색해서 설치하자 그리고 새 프로젝트를 만들어보면... 아래 Vue.js를 만드는 프로젝트가 보일것이다 이거로 새 프로젝트를 만들자..! 일.. 2022. 12. 8.
Whitespace Characters 제거하기 + 여러가지 Whitespace Characters는 공백문자 그리고 이 WhiteSpace Character의 종류에는 1. 가로 크기를 차지하는 공백 문자(눈에 보임) 2. 세로 크기를 차지하는 공백 문자(눈에 보임) 3. 1 또는 2지만 눈에 보이지 않는 공백 문자가 있다 특히 3번의 경우는 일부러 사용하는 경우도 있고(화면에 보여줄 때), 일부러 제거하는 경우도 있다(서버에서 받을 때) 아니 3번같은게 어디 있어~? 라고 말씀하시는 분들은 아래에 더블클릭으로 보라돌이 뚜비 나나 뽀를 선택해보자 NORMAL의 경우는 전체가 블록으로 지정되고, SPACE의 경우는 공백마다 블록 지정, ZERO_WIDTH_SPACE의 경우에는 눈에는 NORMAL이랑 비슷하지만 [보라돌이]를 누르면 보라돌이만 선택되고 [뚜비]쪽을 .. 2022. 11. 26.
재택 개발을 위한 셋업 아이템 목록 1. 허리 받침쿠x에서 샀다. 사실 뒤에 걸어서 의자에 걸어두는건데 귀차나서 이렇게 뒀다그렇게 허리를 지탱해준다는 느낌은 없는데, 그냥 엉덩이 위부터 기대고 있기 편한 느낌을 만들어준다 2. 발 받침대 얘도 쿠x인가 네이x에서 샀다일반 목재는 아무래도 나무 껍질이 발에 박힐수도(이런 일은 거의 없을거야..사포질 하기때문에) 있고, 맨발에는 느낌이 별로라서얘로 쓰고있다짧은다리...라서 그런건 절대 아니고!!의자에 앉아서 발 올리고 있음 세상 편하다 3. LED 모니터 스탠드오늘 아침 새벽에 출근도 전에 배송이 왔는데.. 대충 조립해놓고 출근했다 유튜브에서 이거 쓰시는분들을 봐서 나도 함 써보고 싶었다그리고 거실에서 아버지가 주무시는데, 코딩쟁이들은 새벽에도 코딩하거나 컴퓨터를 하지 않는가...혼자 사는 자.. 2022. 11. 16.
네이버클라우드 써밋 온라인 이벤트 참여! 2022. 11. 15.
용어: Cloud Service & On-premise(+ BaaS) ! 제 생각으로 작성했고 무지성 복붙을 하지 않은 글이며 DevOps가 아니고, 주니어 개발자이므로 오개념이 있을 수 있습니다. 틀린 개념이 있다면 부디 친절하게 알려주세요! 일단 웹을 접하다 보면 서버나 클라이언트란 말을 많이 들어봤을 것이다 DB단으로부터 데이터를 가져와서 가공해서 보여주거나 클라이언트(브라우저)에서 입력된 데이터를 DB로 넣어서 CRUD를 하게 하는게 웹 서비스이다 그리고 이런 서비스로 돈을 벌기 위해서는 백엔드나 프론트엔드 서버를 사내에 설치할지, 외부에 설치할지 등을 정하게 된다 그리고 그런 서버 관련된 사양은 네트워크 장비를 두고 운영하는 것이고 랙(RACK-선반)에 네트워크장비(기본적인 컴퓨터[CPU, RAM, SSD/HDD], 암호화기,LB etc)을 두게 됩니다 그리고 이.. 2022. 10. 29.
모바일 환경 테스트하기(기기로 접속) 보통 npm install serve로 해서 내부적으로 서버환경을 만들어서 오픈된 포트를 모바일로 들어가곤 한다 근데 기왕 인텔리제이를 쓰는 김에 인텔리제이가 제공해주는 built-in 옵션으로 이용해보자! @media 쿼리를 쓰는 반응형 테스트 말고, 모바일 기기로 접속했을 때 어떤 기능을 disable 하거나 동작을 다르게 하고싶은 경우 이용하면 된다 일단 프로젝트에 resources 아래에 test할 html 파일을 만들자 나같은 경우 그냥 index.html로... vanilla js code로 돔이 준비된 경우 함수가 실행되도록 했다 웹 환경일때 result Division element에 web이라고 파란색으로 표시하고, 모바일 환경일때는 mobile로 표시하고 빨간색으로 표시하는 거다 인텔리.. 2022. 10. 23.
협업을 위한 DTO Response Custom 뭐 기본적으로 Entity가 아닌 DTO를 Response로 내려보내야 하는 것은 다들 알 것이다 우리 회사의 Entity Spec을 외부에 노출하지 않으며, Setter가 열린 채로 Entity를 내려보내고, 아직 메모리에 올라와 있는 채로 어딘가에서 누군가가 수정을 하고, 업데이트나 머지가 일어난다면(영속성인 객체상태에서) 끔찍한 일이 아닐 수 없다 static으로 내부클래스로 구현할지 말지는 본인 선택이다. 깔끔해진다는 장점이 있으나 OuterClass.InnerClass이렇게 인자나 반환값이 바뀌게 되어 오히려 이게 안예쁘게 보일 수 있다 프로젝트 브라우저 내에서 이쁘게 보일것이냐 => static(inner) 코드 레벨에서(함수 인자나 반환값으로 쓸 때) 참조를 깊게 안할것이냐 => non st.. 2022. 10. 23.
IntelliJ Honey Tips 4 - 필수!(feat. 협업하기 위한 셋업) 개발에 대한 포스팅이 꽤나 늦었다 ㅎㅎ 회사에서 이리 치이고 저리 치이고 야근도 한다고! 자, 우리 개발자들은 다른 사람의 코드를 보기도 하고 내가 수정하기도 하고, 내가 만든 코드를 다른 사람이 보게 된다 면접때 면접관이 중요하게 보는 포인트 중에 하나는 팀프로젝트 경험이 있는가(취준생인 경우), 회사를 다녀본 경우는 다른 팀원들과 소통의 오류를 겪었을 때 어떻게 해결했는가?(이직인 경우) 이다 이 두 질문의 Main Context는 협업이다! 코드레벨에서의 협업은 Git Commit Message Convention, Camel/Kebab/Pascal Case Convention, variable Convention, JavaDoc작성, Hard Wrap(IDEA), ESLint or TSLint, .. 2022. 10. 23.
MongoDB Day Seoul 2022 & 블랙 아담 후기 저번달에 MongoDB Day 사전신청 안내 메일을 받았었다현재 회사에서 MongoDB를 사용하고 있고, 나도 풀스택으로 Aggregation 만들고, 프론트에 붙이고 하다보니까 정이 들었다..오늘은 회사 말고 양재역으로 출근을 하게되었다10시까지 등록을 마쳐야 해서 그런가... 줄이 엄청 길었다인스타그램 해시태그를 달아서 올려주면 뭔가 경품을 주는 이벤트도 있었다나 이거 받고싶었는데 어떻게 받는지 몰라서...오늘 못받았다..ㅠㅠㅠㅠㅠ흑 사전신청을 했기때문에 명함이랑(전날 문자로 미리 지참하라고 했었음) 문자로 받은 바코드를 보여주면 이런 회사명 이름 직책 그리고 QR코드, 그리고 점심식사 쿠폰과 기념품 교환권이랑 세션 스케쥴이 적힌 종이를 받을 수 있다. 목걸이 안에 넣을 수 있음!드디어 안으로 들어갔.. 2022. 10. 20.
jar Build Task(Feat. thin/plain, fat/uber) + no main manifest attribute in ... 우선 프로젝트를 만들때 Spring initializer로 만들면 IDE가 배포 패키징(아카이빙)을 WAR로 할지, JAR로 할지 선택하라고 한다 그리고 의존성 관리는 Maven(Pom.xml)로 할건지, Gradle(build.gradle-Groovy)로 할건지도 선택하게 된다 일단 이 글에서는 Maven/Gradle, War/Jar의 차이보다는 전반적인 패키징에 대한 것, 그리고 plain-jar, not plain-jar가 무엇인지에 대해서 포스팅해보려고 한다 일단 나 그리고 우리 회사는 로컬에서 빌드 후 파일통신으로 jar를 올려서 돌리기때문에 서버에서 터미널로 빌드를 하지는 않는다 그리고 로컬에서 빌드할때는 빌드 Task의 build를 이용하기보단 bootJar를 이용한다(IntelliJ) 이제.. 2022. 9. 4.
소프트웨어 개발 원칙들 모음 어떤 일을 할때의 방법은 여러 사람들이 반복해서 해보고, 100% 정답은 아니지만 99% 올바른 Best Practice가 나오기 마련이다 빅데이터처리를 거쳐서 어떤 일관된 결론을 도출하는것처럼 ㅋㅋ 첫번째로는 소프트웨어 개발 3대 원칙이 있다 1. KISS Keep It Simple Stupid / Keep It Short Simple / Keep it Small Simple 등의 앞글자를 따서 만든 약어라고 한다 '소프트웨어를 설계하거나 코딩하는 행위에서 되도록이면 간단하고 단순하게 만들라'는 원칙이다 소스코드나 설계 내용이 불필요하게 장황하거나 복잡해지는 것을 경계하라는 의미이다 단순할수록 이해하기 쉽고, 이해하기 쉬울수록 버그가 가능할 가능성이 줄어들고, 이는 곧 생산성 향상으로 이어진다 출처: .. 2022. 9. 3.
~ 2022.09 회고 + 주니어/신입 개발자의 자세, 그리고 방향성 요즘 내가 못하고 있는 부분, 잘 하고 있는 부분, 그리고 직장인이 되어서 총 개발 기간 1년 조금 넘은 2년차 개발자로서 느낀 점을 적어보려고 한다내가 느끼고 겪고 적은게 정답이 아닐 수도 있다는 점 알아주셨으면 좋겠습니다그리고 반말과 존대를 섞어 쓸 수도 있다는 점 회고일단 난 가산에서 Excel + Python + Visual Basic을 다 써서 엑셀과 앱, 웹 개발을 다 도맡아서 짧게 개발한 것을 개발 커리어로 시작했다알다시피 가산디지털단지, 구로디지털단지쪽이 흔히 계약뻥튀기로 온 SI 개발자들을 많이 접할 수 있는 동네이다나는 운 좋게도 그런 경우는 아니었다다만 내가 전공자로써 이것저것 다 개발을 할 수 있다고 어필을 했었기때문에, 대표님이 원하는 개발제품을 어떤 언어이든, 어떤 플랫폼이든 상.. 2022. 9. 3.
맥은 리눅스인가요? 차라리 질문을 유닉스인가요?라고 말했으면 맞았을텐데 아쉽다 맥과 리눅스는 형제도 아니고 먼 친척쯤이다 잠시 Unix의 역사에 대해서 짧막하게 쓰겠다 Unix는 Bell 연구소의 AT&T에서 만들어졌다 시간이 지남에 따라 캘리포니아 대학교 버클리 캠퍼스의 빌 조이가 유닉스 소스코드를 기반으로 BSD의 최초 버전을 배포하였다 BSD는 Berkeley Software Distribution에서 앞글자를 따서 불리게 된다 그리고 Linux는 Linux is not Unix라는 뜻으로 시작했다(이 이름을 따서 NoSQL도 Not only SQL같은 재귀적인 이름이 나오지 않았나 한다) 리눅스 코드는 그 유명한 리누스 토발즈 형님이 개발했고 어떤 유닉스 코드도 포함하지 않았다고 한다 참고로 리눅스가 더 먼저 만들어.. 2022. 9. 3.