본문 바로가기
반응형

전체398

[VSC] vim 불편한 특수키 조정 개발 IDE 툴인 Visual Studio Code(이하 vsc)는 다양한 확장팩(? 플러그인?)을 제공합니다. 근래 copilot과 더불어 copilot chat이 지원되는데, 이 툴은 2023년 8월 8일 현재에도 vsc에서만 제공되고 있어서, 위상이 끝없이 올라가는 거 같다. (막상 copilot chat을 사용하면서 chatgpt를 일정 기대한 나에게는 조금 아쉬운 내용도 있다.) JetBrain 툴이 메모리는 많이 먹지만 그 편리함이란.. 하지만 비용때문에 회사 지원도 어느 정도 정리되고 vsc로 가려는 움직임이 있기 때문에, 여러 조건들의 변화로 인해 vsc로 넘어가려고 노력 중입니다. 저는 윈도 GUI 기반 프로그래머이지만 웬지 vi(m) 툴이 먼가 있어 보입니다. (과거 어느 여자 개발자가.. 2023. 8. 8.
[laravel] docker 환경에서 설치하기 with sail 주의) laravel 최신 버전을 기본 설치 합니다. 하위 버전으로 내리는 거 힘들어요. 하지 마세요. ^^ 잠시 본업에 충실하면 세상은 많이 변하고 있다. 본업의 해야할 것과 개인적으로 하고 싶은 것이 다르면 딜레마에 빠진다. laravel 솔루션을 보면 laravel/app을 사용하지 않고 있다. 괜히 봤다. 궁금했다.. 과거에 해봤던 팩키지 생성.. 으로 하는데.. 그렇다면 팩키지도 만들어 봐야 하는 거 아닌가? 이참에 하는 김에 빠방한 윈도 환경도 세팅을 했으니, docker 환경에서 wsl을 사용해서 해보자~ 싶었다. 괜한 생각은 꼬리에 꼬리를 물고... =_=;; 그렇게 환경은 정리가 되었으니... windows11 pro + wsl 2 + Ubuntu20.04.6 docker desktop .. 2023. 7. 12.
크롬 프로필에서 개발 중인 크롬 익스텐션 등록 방법 크롬에서 프로필 별로 사용이 가능하도록 지원해 줍니다. 구글 로그인 계정별로 동기화도 가능합니다. 그렇다면 크롬 익스텐션 앱도 프로필별로 사용이 가능할까요? 가능하더군요~! 다만 첫 화면에서 확장프로그램 관리 아이콘이 없어서 순간 당황했습니다. 프로필 별로 확장 프로그램 사용하기 기존 확장프로그램 설치와 동일 합니다. 다만 첫화면에 확장 프로그램 관리 아이콘이 없어서 주소 표시줄에서 직접 입력해서 진입을 해야 합니다. chrome://extensions 확장 프로그램을 설치해 보신 분은 익숙한 "확장 프로그램" 페이지로 진입을 합니다. 확장 프로그램 관리 페이지에서 "개발자 모드"를 선택하면 "압축해제된..."과 함께 총 3개의 버튼이 나옵니다. "압축해제된 확장 프로그램을 로드합니다." 버튼을 클릭하면.. 2023. 4. 17.
ChatGPT에 자비스를? Mac에서 말로 물어보기! ChatGPT가 얼마전에 유료 서비스를 추가했습니다. 저도 고민 끝에 하나를 포기하고 이걸 써보기로 했습니다. 포기한 것은 copilot.. 이게 chatgpt에서 나온 거라고 하니.. 유료로 쓰자고 마음 먹은 이유는, 간혹 chatgpt가 속도가 빠른 때가 있습니다. 보통은 랙이 걸려서인지 멈칫 멈칫 나오는 때가 많은데요, 종종 쫘르르륵~! 나오는 걸 보면 웬지 마음이 편해집니다. 너무 자주 속으로 "넌 왜 말을 하다 말아? 무슨 말을 하려고 멈추니?" 이랬는데~ 유료는 무조건 빠르다네요. 그래서 고민 끝에 결제를 했습니다. 몇번 사용을 하다 보니.. 귀차니즘 발동.. 전에도 자비스 같음 좋겠다.. 싶었는데.. 그래서 chatgpt에게 물어봤습니다. 음성 입력을 할 수 있는 방법 있냐고~ 결과는 없데요.. 2023. 2. 14.
[svelte 실무적용] #2. child 변수값을 parent 변수에 업데이트 하기 사이트가 복잡해져 가면 component 를 잘게 찢어서 사용하기에 한계가 있다. 이유는 상위 parent component 에서 하위 childe component 를 호출하는 거야 문제가 없겠지만, 하위 child component 내부에서 변경된 변수값을 상위 parent 에 전달하기 복잡하다. 복잡하지만 그래도 사이트를 만들어야 하니 해야지.. 참조페이지 https://svelte.dev/examples/component-bindings 1. dispatcher 사용 참조 페이지 : https://svelte.dev/tutorial/component-events 자주 애용하지만 복잡하다. vuejs 에서 $emit()과 거의 같은 역할을 한다. vuejs 를 하다 보니 아래 $emit과 동일한 걸.. 2022. 8. 12.
[TOOL] js 베이스 스트레스 테스트 툴 : k6 https://k6.io/ 설치(mac) brew install k6 기본 테스트 스크립트 샘플 # filename: script.js import http from 'k6/http'; import { sleep } from 'k6'; export default function () { http.get('https://test.k6.io'); sleep(1); } 기본 실행 방법 k6 run script.js VU (Virtual User) 추가 실행 k6 run --vus 10 --duration 30s script.js --vus : 동시접속자를 10명으로 유지 --duration : 30초 동안 vus 수를 유지 호출 옵션 vu, duration을 소스에 추가해서 실행 import http from.. 2022. 8. 5.
[svelte 실무적용] #1. 사용이유, html 에디터(quill), SEO 적용 샘플 SvelteJS 사용 이유? 빠르다니깐, 궁금해서~! 그런데 모르겠다. react, vue, svelte 모두 빌드한 js 소스를 서버에 올리고 다운로드 받아서 사용하는 진짜 프론트엔드 사이드 스크립트다. 중간의 내용이야 어찌저찌 해서 팩키징 결과물이 조금씩 틀려지기는 하겠지만, 그렇다고 속도 측면은 잘 모르겠다. react는 안써보고, vue랑 별반 차이가... 그냥 빠르다니깐.. 그런가? 하는데.. 알아서들 참조하시고~ 아직 vite, rollup 차이를 구분 못하고, 실무에 sveltejs를 적용해 보면서, 맨땅에 헤딩하는 심정으로 진행하면서 실무에 필요한 내용 중에 빠져 있거나, 샘플에서 커스터마이징이 필요한 내용들을 정리해서 올려 보겠다. typescript를 사용하는 이유? 정형화된 틀에 맞춰.. 2022. 8. 4.
[MAC] 원격 접속 VNC 포트 변경 맥 원격접속은 파인더(Finder)에서 [Command+K] 로 쉽게 VNC를 실행할 수 있습니다. 이때 사용되는 디폴트 포트는 5900 입니다. 개인적으로 회사컴에 원격접속을 하기 위해서 열린 포트는 윈도우용 원격데스크톱의 포트인 3389 입니다. 그렇다 보니 윈도 접근은 쉬운데, 회사 맥에 원격접속을 하려면 절차가 까다롭습니다. 그래서 맥 VNC서버 포트 자체를 5900에서 3389로 바꾸려고 합니다. 맥 VNC 원격접속 포트를 5900에서 윈도우 원격데스크탑 포트인 3389로 변경하기 $ sudo vi /etc/services # 5900 포트 검색 후 3389로 변경 /5900 # 기존 3389는 주석 처리 # ms-wbt-server 3389/udp # MS WBT Server # ms-wbt-.. 2022. 2. 23.
[크롬:앱] 크롬 확장 프로그램 #1. Hello World 갑자기 크롬 확장 앱이 만들어 보고 싶어졌습니다. 몇년 전에 관심을 가지고 잠깐 보기는 했지만, 멀 만들지??? 하는 생각에 잠깐 보고, 이렇게 만드는 구나~~ 하고 말았는데, 유투브 동영상에 나오는 광고가 귀찮아서 없애볼까 하는 생각에 다시 크롭앱을 보기 시작했네요.. 크롬 관련된 개발할 수 있는 종류가 몇가지 됩니다. https://developer.chrome.com/docs/ Documentation - Chrome Developers Build the next generation of web experiences. developer.chrome.com 이중에서 페이지가 로딩되면 곧바로 실행되어야 하니, Extensions 항목을 먼저 공부해 봅니다. https://developer.chrome... 2022. 2. 21.
[GIT] .gitignore 사용 .gitignore ? github, gitlab 등으로 소스 관리 및 배포가 대세입니다. 하지만 개발하는 OS, 플랫폼, IDE 등 사용환경에 따라 각자 관리하는, 배포에 상관없는 파일이나 디렉토리가 생깁니다. 이 파일들을 제외하기 위해서 .gitignore 파일이 사용됩니다. 파일 생성 git init 사용 방법 // flutter 프로젝트 기준으로 정리합니다. // 지정된 파일 제외 .metadata // 특정 패턴 파일들 제외 *.lock // lock 확장자 파일 제외 .* // . 으로 시작하는 파일 제외 // 특정 디렉토리만 삭제. 맨앞에 / 붙여야 합니다. /android/ // 디렉토리 이하 특정 파일 제외 /android/*.lock // android/ 이하 lock 확장자 파일 들 제외 2021. 3. 19.
[flutter] FlutterFire를 이용한 firebase 연동 #1. 설치 - iOS/macOS FlutterFire는 Flutter 앱으로 Firebase를 연동하는 Flutter 플러그인 세트 입니다. 기본은 macos 개발을 위한 정보 확인 중에 찾은 자료라서 플랫폼 별로 모두 설정 확인을 하도록 해보겠습니다. 주의) 1주일 가까이 firebase와 씨름을 한 거 같습니다. 상황이 m1 맥미니를 구입한지 얼마 안되었고, flutter 2.0에 깜짝 발표된 뒤라, 먼가 정리되지 않은 상태에서 버전 이슈라고만 생각을 했었는데... ㅠ,.ㅠ 더보기 기본 시스템 환경 Mac Mini 2020 M1 (8core CPU, 8core GPU, 8GB Ram), macOS Big Sur 11.2.2 Flutter 2.0.2 / Dart 2.12.12 / CocoaPods 1.10.1 Android Studi.. 2021. 3. 15.
[flutter] setState 없이 상태 값 변경 - ValueNotifier 하나의 StatefulWidget에서 상태 값을 관리하는 방법은 setState()를 사용하는 것입니다. setState() 없이 상태 값을 관리할 수도 있는데, ValueNotifier를 사용하는 것입니다. ValueNotifier가 좋은 것은 다른 위젯에서 변경한 상태값을 적용할 수 있습니다. setState() 없이 상태값을 변경하는 예제 class MyHomePage extends StatefulWidget { MyHomePage({Key? key, required this.title}) : super(key: key); final String title; @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHome.. 2021. 3. 12.
[MAC M1] laravel + valet + php7.3 다운그레이드 방법 맥 M1에서 지원하는 PHP 기본 버전은 8.0.3 입니다. 터미널 사용 버전을 다운그레이드 하는 것은 쉬운데, 웹은 여전히 8.0이 사용되고 있었습니다. 웹서버는 valet을 사용하고 있었는데, 생각보다 버전 변경하는 것이 쉽네요. 매뉴얼을 대충 보면 안됩니다. ^^ ※ 아래 내용은 모두 로제타로 실행한 터미널에서 실행해야 합니다. 현재 m1에서는 php 8.0 이상만 지원하는 것으로 보입니다. % php -v PHP 8.0.3 (cli) (built: Mar 4 2021 20:45:17) ( NTS ) Copyright (c) The PHP Group Zend Engine v4.0.3, Copyright (c) Zend Technologies with Zend OPcache v8.0.3, Copyri.. 2021. 3. 10.
[MAC M1] laravel + vuejs + vuetify 설치 php, laravel, vuejs, vuetify 설치 brew install php@7.3 php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');" php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;" ph.. 2021. 3. 8.
Android 폰을 macOS에 미러링을 해보자 안드로이드폰을 미러링으로 윈도우10에 연결하는 방법은 무척 쉬워졌다. (전용앱이 있지 아마???) 하지만 맥은 아직 유료 앱이 아니면 사용이 힘든 것으로 보인다. 라고 생각을 했는데... 약간의 수고를 하면 무료로 미러링을 할 수 있는 방법이 있네~ 참조 URL : https://github.com/Genymobile/scrcpy 설치 조건 더보기 macOS Catalina Ver. 10.15.5 MacBook Pro 16인치 2019. i9 2.3GHz 8 core. RAM 32G homebrew 설치 설치 스크립트 // 설치 brew install scrcpy // adb 관련 PATH 추가 brew cask install android-platform-tools 안드로이드 USB 연결 (모바일 설정.. 2020. 7. 2.
[VueJs] amcharts3 사용하기 설치 npm install amcharts3 --save 사용 샘플 소스 오류 수정 import AmCharts from 'amcharts3' 위 형태로 하면 AmCharts.makeChart() 함수를 찾을 수 없다는 오류가 나와서 수정 참조 URL https://github.com/developerKumar/AmchartsUse 2020. 6. 19.
[Win10] VirtualBox Error. Raw-mode is unavailable courtesy of Hyper-V. wsl2를 설치하고 docker desktop을 설치하려다 실패를 했는데, 사이드 이펙트로 VirtualBox가 정상적으로 동작하지 않는다. ㅠ,.ㅠ; 에러 메시지 Raw-mode is unavailable courtesy of Hyper-V. 해결 방법 // bcdedit 실행 bcdedit // hypervisorlauchtype 확인 hypervisorlaunchtype = On // Off 변경 bcdedit /set hypervisorlaunchtype off // hyervisorlaunchtype 확인 // 리붓 리붓을 한 후에 VirtualBox를 다시 실행해 본다. 2020. 6. 18.
[Laravel] FCM을 이용해서 웹푸시 발송하기 https://picory.com/entry/Laravel-Web-Push-%EB%B0%9C%EC%86%A1%EA%B8%B0 얼마 전에 테스트 중이던 웹 푸시 소스가 사용자를 일정 수준으로 넘어서면서 인지, 아니면 원래 그런 건지 모르겠지만, 메시지는 전송했다는데, 테스트 하는 사람들은 받지 못했다고 하는 상황이 자주 연출이 되었다. 전송했다는데? 왜 안오지? 나는 잘되던데... 하다가 나도 받지 못하는 상황이 생기니... 이거 너무 불안정한데?? 싶어서 FCM을 사용하기로 하고 다시 정리를 해본다. 설치 composer require brozot/laravel-fcm config/app.php 설정 'providers' => [ // ... LaravelFCM\FCMServiceProvider::cla.. 2020. 6. 15.
[VueJs] API 기능 모음 (추가 중) history.back() this.$router.go(-1) UI 강제 업데이트 this.$forceUpdate() // string replace all let replaceAll = function (source, needle, target) { return source.split(needle).join(target) } // 를 변환 let decodeHTML = function (html) { let txt = document.createElement('textarea') txt.innerHTML = html return txt.value } 2020. 6. 7.
[og] 카카오톡 메시지에 URL 첨부시 제목이 URL로 나오는 경우 및 테스트 방법 6월 부터인가? 갑자기 카카오톡에 특정 사이트 URL을 전송하면 보여주던 이미지와 제목에서 이미지는 정상인데 제목이 문제가 되었다. 제목이 URL로만 보인다. 잘되는 것이 안되니 호기심이 생기네... 카카오톡은 어떤 것을 참조해서 제목을 가져오는 걸까? 카카오톡의 테스트 URL? 개발자 센터 일단 카카오톡 메시지로 전송이 되면 어떻게 되는지 미리 알수 있는 방법은 카카오톡 개발자 센터에 있다. 생뚱맞기는 하지만 카카오 스토리 > RESTAPI > 웹 페이지 스크롤링에서 테스트를 제공한다. [페이지 링크] 테스트는 간단하지만 개발자 센터에서 API 테스트기 때문에 액세스 토큰을 발급받아야 한다. 카카오톡 아이디만 있으면 되는 걸로 알고 있으니, 귀찮겠지만 테스트를 위해서 개발자센터에 등록 후 토큰을 발급 .. 2020. 6. 6.
[Laravel] Eloquent ORM, Query Builder로 실행한 full query 확인 개발 중 자주 쿼리를 확인하는 일이 있다. 그런데 ->toSql()로 하게 되면 바인딩 전 쿼리만 나와서 해당 값이 정상 들어갔는지 확인이 어려울 수 있다. 이번에는 mysql 4.x old 버전에 쿼리 질의를 할 일이 생겼는데, php 5.x 버전 부터 mysql 4.x 버전을 지원하지 않고, 어느 언어를 사용하더라도 4.x 버전을 미지원이라는 장벽을 맞이하게 되었다. 결국 원격으로 php 5.x 저 버전에 raw 쿼리를 던져서 질의 하도록 미들웨어 개념의 api를 만들었다. 기본 어드민 툴은 laravel에서 사용을 해야 하니 raw query를 생성해서 던지는 작업을 해야하는 경우가 생긴 것이다. 머 이유가 어찌 됐건 일단 바인딩된 최종 raw query 획득을 위한 작업을 진행하기 위해서 설정 작.. 2020. 5. 30.
반응형