DalpangLOG

Vue3에서 웹 화면에 변경 되는 반응형 값에 ref, reactive를 사용하듯이,React에서는 useState를 사용해 변경감지를 한다.useStateimport {useState} from 'react';function ExampleApp() { const [selectedTopic, setSelectedTopic] = useState('Initial Value'); fuction handleUserSelect(selectedValue) { setSelectedTopic(selectedValue) } ... {selectedTopic}}React에서 앞에 'use' prefix가 붙은 것들은 react hooks에 속한다.useState Rule..

Programming/코테 공부 2024. 12. 23. 18:13

서비스를 만들고 나면, 서비스를 사용자들에게 제공하기 위해 배포라는 단계를 거쳐야한다.현재는 많은 서비스 업체들이, 클라우드 서비스를 사용하면서 무중단 배포 를 사용하고 있다.이를 통해 서비스를 내리지 않고, 배포 중에도 서비스를 제공할 수 있다.현재 많이 언급되는 무중단 배포 전략에는 다음 세가지 방법이 있다.RollingBlue-GreenCanaryRolling 배포파드가 여러개인 경우, 하나씩 순차적으로 새로운 이미지로 배포 되도록 하는 방식다운타임을 최소화한다는 점이 장점으로 꼽히며, 마이너한 버그 픽스 정도의 배포시에 사용하기좋다.만약 배포 중에 사용자가 서비스에 접근하게 될 경우, 구, 신버전의 어플리케이션중 어느 서비스에 접속 될지 모른다는 단점이 있다.모든 파드가 새로 배포 되기까지 blu..

개발공부/DevOps 2024. 12. 22. 20:24

프론트 페이지는 index.js 파일로부터 로딩 되기 시작한다.React 프로젝트의 경우, index.html 파일에서, 리액트 파일 확장자인 jsx로 만들어진 index.jsx 파일을 임포트 하며 시작된다.Index.jsx 파일은 웹 어플리케이션을 export 하고있는 App.jsx 파일을 import 하고 있다.Index.jsx 파일이 앱의 진입점.  개발자가 추가하는 커스텀 컴포넌트는 결과적으로 html 태그로 변환되어 사용된다.때문에, 커스텀 컴포넌트를 만들어서 사용할때는 이름 충돌이 일어나지 않도록, Uppercase로 시작하도록 해야한다.Props리액트 함수에서는 하나의 prop만 받으며 일반적으로 props라는 명칭으로 사용한다.단, 하나의 값만 받을수 있는게 아니라 prop이라는 객체로 ..

Programming/FrontEnd 2024. 12. 17. 02:41

https://dalpanglog.tistory.com/127 jekyll로 github.io 블로그 만들기 - 6https://dalpanglog.tistory.com/126이제 새로운 포스트를 작성해보자!_post 디렉토리 하위에, 새로운 파일을 생성한다.일반적으로 가장 자주 사용되는 파일 확장자는 markdown과, html 이다.여기서는 markdown으dalpanglog.tistory.com 여기에 이어서 오늘 깃허브를 들어가봤더니, 빌드가 제대로 안되고 있다는것을 알게 되었다.깃허브 내에서 빌드 에러 로그를 찾아보니,  기존에 지정했던 테마를 못찾는것으로 보였다.찾아보니 _config.yml파일에 적은 theme대신 remote_theme을 지정 해야하는것으로 보였다. (참고 : https:/..

개발공부/개발공부 2024. 9. 16. 00:04

https://dalpanglog.tistory.com/126 jekyll로 github.io 블로그 만들기 - 5https://dalpanglog.tistory.com/125 파일 및 디렉토리 구조를 볼수 있는 사이트https://jekyllrb-ko.github.io/docs/structure/ Directory StructureA basic Jekyll site usually looks something like this:jekyllrb.com 기본적으로 이제 작성dalpanglog.tistory.com 이제 새로운 포스트를 작성해보자!_post 디렉토리 하위에, 새로운 파일을 생성한다.일반적으로 가장 자주 사용되는 파일 확장자는 markdown과, html 이다.여기서는 markdown으로 생성해..

개발공부/개발공부 2024. 9. 15. 00:46

https://dalpanglog.tistory.com/125 jekyll로 github.io 블로그 만들기 - 4https://dalpanglog.tistory.com/124 jekyll로 github.io 블로그 만들기 - 3https://dalpanglog.tistory.com/123 jekyll로 github.io 블로그 만들기 - 2지난 시간에 이어서!https://dalpanglog.tistory.com/122 jekyll로 github.io 블로그 만dalpanglog.tistory.com  파일 및 디렉토리 구조를 볼수 있는 사이트https://jekyllrb-ko.github.io/docs/structure/ Directory StructureA basic Jekyll site usual..

개발공부/개발공부 2024. 9. 14. 00:24

https://dalpanglog.tistory.com/124 jekyll로 github.io 블로그 만들기 - 3https://dalpanglog.tistory.com/123 jekyll로 github.io 블로그 만들기 - 2지난 시간에 이어서!https://dalpanglog.tistory.com/122 jekyll로 github.io 블로그 만들기 - 1일단 루비를 깔아야 하는데, 맥을 사용한다면 맥에는dalpanglog.tistory.com 지난 시간에 지킬 뼈대를 잡아놓았다면, 이제 테마를 입힐 차례.여러 사이트들이 있지만 나는 아래의 사이트에서 테마를 찾았다.https://jekyll-themes.com/ Jekyll ThemesA collection of the best jekyll the..

개발공부/개발공부 2024. 9. 13. 12:01

https://dalpanglog.tistory.com/123 jekyll로 github.io 블로그 만들기 - 2지난 시간에 이어서!https://dalpanglog.tistory.com/122 jekyll로 github.io 블로그 만들기 - 1일단 루비를 깔아야 하는데, 맥을 사용한다면 맥에는 기본적으로 깔려있는 버전이 존재한다.때문에, 노드 버전dalpanglog.tistory.com 이제 깃허브에 올려서 github.io페이지를 만들어 보자github 에서 "아이디.github.io" 형식으로 리포지토리를 만든 후, 연결 방법 나온대로 작업해주면 끝이긴 하다.echo "# ${아이디}.github.io" >> README.mdgit initgit add README.mdgit commit -m ..

개발공부/개발공부 2024. 9. 12. 00:04

지난 시간에 이어서!https://dalpanglog.tistory.com/122 jekyll로 github.io 블로그 만들기 - 1일단 루비를 깔아야 하는데, 맥을 사용한다면 맥에는 기본적으로 깔려있는 버전이 존재한다.때문에, 노드 버전을 관리할때 nvm을 사용하는 것처럼, 루비도 rbenv, RVM등을 이용하여 버전관리를 하dalpanglog.tistory.com지난시간에 jekyll을 깔기 위해 최신 버전의 ruby를 설치했고, 해당 버전으로 ruby가 실행되도록 세팅해주었다. 이제 지킬의 도큐먼트를 따라 stepbystep따라가보자https://jekyllrb.com/docs/step-by-step/01-setup/ SetupWelcome to Jekyll’s step-by-step tutori..

개발공부/개발공부 2024. 9. 11. 01:18

일단 루비를 깔아야 하는데, 맥을 사용한다면 맥에는 기본적으로 깔려있는 버전이 존재한다.때문에, 노드 버전을 관리할때 nvm을 사용하는 것처럼, 루비도 rbenv, RVM등을 이용하여 버전관리를 하도록 권장 하는것으로 보인다.여기선 rbenv를 사용해 설치해봤다.brew install rbenv터미널에서 위 커맨드를 사용해 brew로 rbenv를 설치한 후, 다음의 커맨드로 설치 가능한 ruby 버전을 확인할수 있다.rbenv install --list이왕이면 stable release로 깔기로 함.rbenv install 3.3.5커맨드 실행으로 stable 버전 ruby를 일단 설치했다.전역으로 사용할 ruby 버전을 새로 깐 버전으로 세팅해주기rbenv global 3.3.5 ~/.zshrc 파일에..

카테고리 없음 2024. 9. 11. 00:52

JavaScript - Rest Param?- Required로 입력하는 파라미터 이외에 추가로 가변적인 길이의 파라미터가 입력 될 수 있는 경우 활용 가능한 파라미터https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters Rest parameters - JavaScript | MDNThe rest parameter syntax allows a function to accept an indefinite number of arguments as an array, providing a way to represent variadic functions in JavaScript.developer.mozill..

Programming Languages 2024. 8. 28. 22:36

submodule update 한번 잘못했다가 먼길 간 삽질 로그yarn local로 서버를 띄웠더니 다음과 같은 에러가 나기 시작했다.처음엔 node-sass를 다운받아야 하는줄알고 다운받았는데, 여전히 문제가 있었음..결과적으로 프로젝트 package.json에 적혀있던 node-sass버전은 node 18에 맞고, 나는 기존 package.json이 업데이트 되기 전 버전인 node 16버전으로 계속 돌려서 그런게 아닌가 싶다.설치했던 node-sass를 제거하고 캐시날린다음,node v18을 사용하도록 설정하고, 프로젝트내 yarn.lock, node_modules를 삭제한다음 다시 패키지를 설치해줬다. #설치했던 node-sass 제거yarn remove node-sass#sass 추가yarn ..

개발공부/개발공부 2024. 6. 19. 13:28

brew update를 실행하던 중 다음과 같은 에러가 발생했다.Error: Unexpected method 'appcast' called on Cask adoptopenjdk8.-> instruction에 따라 alfred설치Ta da!

개발공부/개발공부 2024. 6. 19. 12:58

Q: 1부터 6까지 숫자가 적힌 주사위가 세 개 있습니다. 세 주사위를 굴렸을 때 나온 숫자를 각각 a, b, c라고 했을 때 얻는 점수는 다음과 같습니다.세 숫자가 모두 다르다면 a + b + c 점을 얻습니다.세 숫자 중 어느 두 숫자는 같고 나머지 다른 숫자는 다르다면 (a + b + c) × (a2 + b2 + c2 )점을 얻습니다.세 숫자가 모두 같다면 (a + b + c) × (a2 + b2 + c2 ) × (a3 + b3 + c3 )점을 얻습니다.세 정수 a, b, c가 매개변수로 주어질 때, 얻는 점수를 return 하는 solution 함수를 작성해 주세요.딱히 큰 이유는 없지만 Stream를 써서 풀고싶어서 적용시켜본 답안.import java.util.Arrays;class Solut..

Programming/코테 공부 2024. 5. 1. 16:38

VUE 환경변수에 대해 간단하게 알아보기Note that only NODE_ENV, BASE_URL, and variables that start with VUE_APP_ will be statically embedded into the client bundle with webpack.DefinePlugin. It is to avoid accidentally exposing a private key on the machine that could have the same name.(출처 : https://cli.vuejs.org/guide/mode-and-env.html#environment-variables)Vue에서 환경변수는 'NODE_ENV', 'BASE_URL', 'VUE_APP_' 으로 시작하는..

Programming/FrontEnd 2024. 4. 28. 16:21

기초 트레이닝 문제 풀기문제1) 문자열 겹쳐쓰기- 기본 풀이방식class Solution { public String solution(String str1, String str2) { String result = ""; char[] strArray1 = str1.toCharArray(); char[] strArray2 = str2.toCharArray(); for(int index = 0; index  - StringBuilder를 사용한 풀이방법class Solution { public String solution(String str1, String str2) { StringBuilder result = new St..

Programming/코테 공부 2024. 4. 25. 23:11