티스토리

코딩 복습용 블로그
검색하기

블로그 홈

코딩 복습용 블로그

goodsosbva.tistory.com/m

안녕하세여! 코딩 복습용 블로그입니다.

구독자
2
방명록 방문하기
공지 코딩 복습용 블로그!!! 모두보기

주요 글 목록

  • [Docker] 정리(3) - Managing Images & Containers 질&답 형식으로 정리합니다. 1. 이 명령의 결과는 무엇인가요?docker build -t myimage .docker run --name mycontainer myimagedocker stop mycontainer 답: 이미지가 생성되고, 컨테이너가 시작된 다음, 중지 된다.이미지와 컨테이너 모두 개발자가 지정한 이름이 있다.2. 다음 명령이 실행되었다고 가정합니다.다음 명령 중 어떤 것이 실패할까요?docker build -t myimage:latest .docker run --name mycontainer --rm myimagedocker stop mycontainer 답: docker rmo mycontainer => 이유: 중지되면 자동으로 제거되기 때문에, 해당 컨테이너는 사라진다. 3. 이미.. 공감수 1 댓글수 1 2024. 10. 30.
  • [Docker] 정리(2) - Dockerfile Dockerfile이란?Dockerfile은 **도커 이미지(Docker Image)**를 빌드하기 위한 설정 파일입니다.이 파일에는 컨테이너를 구성하고 실행할 명령들이 순서대로 포함됩니다.결과적으로 Dockerfile을 통해 반복적이고 일관된 환경에서 애플리케이션을 실행할 수 있는 도커 이미지를 만듭니다. Dockerfile의 주요 구성 요소와 역할베이스 이미지 설정:FROM: 이미지 빌드를 시작할 기본 이미지를 지정합니다.FROM node예: node 이미지 기반으로 빌드.작업 디렉토리 설정:WORKDIR: 컨테이너 내에서 명령이 실행될 디렉토리를 지정합니다.WORKDIR /app 파일 복사:COPY: 로컬 파일을 컨테이너 내부로 복사합니다.COPY . /app현재 폴더의 모든 파일을 /app 디렉토.. 공감수 1 댓글수 1 2024. 10. 29.
  • 쿠버네티스 실습을 위한 minikube 설치 window 환경에 설치하는 과정을 정리하는 글입니다. macOS 사용자라면 죄송.. 그전에 필요한 기타 프로그램들 관련한 정보는 아래의 주소로 가서 확인할 수 있다.  1. chocolatey https://chocolatey.org/install#individual Installing ChocolateyChocolatey is software management automation for Windows that wraps installers, executables, zips, and scripts into compiled packages. Chocolatey integrates w/SCCM, Puppet, Chef, etc. Chocolatey is trusted by businesses to man.. 공감수 0 댓글수 0 2024. 10. 27.
  • 3차원 BFS 탬플릿 + 자바스크립트 queue 구현 간단 탬플릿 const readline = require("readline");const rl = readline.createInterface({ input: process.stdin, output: process.stdout,});let input = [];rl.on("line", (line) => { input.push(line);});rl.on("close", () => { const result = solution(input); console.log(result); process.exit(0);});class Deque { items = []; front = 0; rear = 0; push(item) { this.items.push(item); this.rear++; } siz.. 공감수 0 댓글수 0 2024. 10. 23.
  • 자바스크립트용 bfs 탬플릿 코드 const readline = require("readline");const rl = readline.createInterface({ input: process.stdin, output: process.stdout,});let input = [];rl.on("line", (line) => { input.push(line);});rl.on("close", () => { const result = solution(input); for (let i = 0; i line.split(" ").map(Number)); let visited = Array.from({ length: n }, () => new Array(m).fill(false)); let cnt = 0; let extents = [].. 공감수 0 댓글수 0 2024. 10. 20.
  • 자바스크립트 입력 받는 방법 const readline = require("readline");const rl = readline.createInterface({ input: process.stdin, output: process.stdout,});let input = "";rl.on("line", (line) => { input += line;});rl.on("close", () => { const result = solution(input); console.log(result); process.exit(0);});function solution(input) {// 로직} 프로그래머스는 입력이 자동으로 되서 신경을 안써도 되는데 백준은 신경을 써야하는데 자바스크립트 입력 받는 방법이 괴랄하다. 여기서 남겨 놓고 필요할 .. 공감수 0 댓글수 0 2024. 10. 17.
  • [Docker] 정리(1) - 이미지 & 컨테이너 1. '이미지'란 무엇인가요? (Docker로 작업할 때)- 이미지는 읽기/쓰기 액세스 권한이 있는 인스턴스를 실행하는 컨테이너의 "블루프린트" 2. '이미지'와 '컨테이너'가 있는 이유는 무엇인가요?'컨테이너'만으로는 왜 안될까요?- 이미지와 컨테이너와의 개념을 통해, 여러 컨테이너가 서로 간섭하지 않고 동일한 이미지를 기반으로 작업할 수 있게 해준다. 3. 컨테이너와 관련하여 '격리'는 무엇을 의미하나?- 컨테이너는 서로 분리되어 있으며, 디폴트로 공유 데이터나 상태가 없다. 4. '컨테이너'란 무엇인가?- 이미지를 기반으로 하는 격리된 소프트웨어 유닛. 이미지의 실행 중인 인스턴스 이다. 5. 이미지의 내부 내용(context)에서 '레이어'란 무엇인가?- 이미지의 모든 명령은 캐시 가능한 레이어를.. 공감수 0 댓글수 1 2024. 9. 22.
  • vue 에서 yup을 사용하여 유효성 검사하는 방법 정리 1. yup 스키마 정의 yup은 스키마를 정의하므로써 규칙을 정의 합니다.const schema = yup.object().shape({ title: yup.string().required('title is required').min(1, 'title is required'), category: yup .string() .required('category is required') .min(1, 'category is required'), data: yup.string().required('data is required').min(1, 'data is required'),}); title: 문자열이어야 하며, 필수 값입니다. 최소 한 글자 이상이 입력되어야 합니다.category: .. 공감수 1 댓글수 0 2024. 9. 6.
  • OS 문제 오답 정리 문제 1: NFS는 네트워크를 통해 파일 및 디렉토리를 공유하는 데 사용되는 프로토콜입니다. 하지만 몇 가지 단점이 존재하는데 이에 가장 올바르지 않은 것은?설명: NFS는 다른 비용이 들지 않는 오픈 소스 프로토콜이며, 기존의 장비와 시스템을 이용하여 파일 공유 및 데이터 관리를 간편하게 구성할 수 있다.옵션:보안 문제네트워크 의존성높은 비용일관성 관리성능 저하정답: 3번 높은 비용 (NFS는 오픈 소스이므로 높은 비용이 들지 않음)문제 3: 다음 중 윈도우 명령어와 그에 대한 설명으로 가장 옳지 않은 명령어는?설명: clear는 Linux 운영체제에서 터미널 화면을 초기화하는 명령어이다.옵션:dir: 현재 위치의 파일과 디렉토리(폴더) 목록 보기cd: 디렉토리 변경copy: 파일 복사clear: 현재.. 공감수 0 댓글수 0 2024. 8. 10.
  • 프론트 문제 - 오답 정리 문제1: 다음 설명으로 올바르지 않은 것은?옵션:null: 사용자가 null값을 변수에 할당한 경우(빈 값이라는 의미)undefined: 변수를 선언하고 값을 할당하기 전의 값이며, 변수에 값이 할당되어 있지 않은 상태undeclared: 변수를 선언하였으나 선언한 변수의 값이 null일 경우NaN: "Not a Number"의 약어이며, 컴퓨터에서 숫자로 나타낼 수 없을 때 나타내는 표시정답: 3번 undeclared: 변수를 선언조차 하지 않은 경우 (올바르지 않은 설명)문제2: Vue.js에서 v-bind 디렉티브의 역할은 무엇입니까?설명: Vue.js에서 v-bind 디렉티브는 HTML 속성을 동적으로 바인딩할 때 사용됩니다. 예를 들어, v-bind는 href 속성을 바인딩하고, v-bind는 .. 공감수 0 댓글수 0 2024. 8. 9.
  • 웹 최적화 정리 ! 이미지 지연 로딩 - 분석 툴1.  Network 패널 Perfornance 패널, Lighouse 패널2. 크롬 개발자 도구의 Coverage 패널3. Squoosh - 서비스 이미지 압축 도구4. PurgeCss - 사용하지 않는 css를 제거해주는 툴 Intersection Observer - 브라우저 제공 api: 웹 페이지의 특정 요소를 관찰하면 페이지 스크롤 시, 해당 요소가 화면에 들어왔는지 아닌지 알려 준다.  ### Intersection Observer 적용 코드import React, {useRef, useEffect} from 'react'function Card(props) { const imgRef = useRef(null); useEffect(() => { const op.. 공감수 0 댓글수 0 2024. 8. 5.
  • aws - cli - 실습 과정 Microsoft Windows [Version 10.0.22631.3880](c) Microsoft Corporation. All rights reserved.C:\Users\admin>aws configureAWS Access Key ID [None]: khsidAWS Secret Access Key [None]: khsacceskeyDefault region name [None]: ap-northeast-2Default output format [None]: jsonC:\Users\admin>aws configure list Name Value Type Location ---- ----.. 공감수 2 댓글수 0 2024. 7. 28.
  • AWS - 실습 - AWS Console EC2 생성 과정 1. AWS Management Console에 로그인AWS Management Console은 AWS 서비스를 관리할 수 있는 웹 기반 인터페이스입니다. 로그인을 하려면 AWS 계정의 이메일 주소와 비밀번호가 필요합니다.2. 'Services' 메뉴에서 'EC2'를 선택'Services' 메뉴는 AWS의 다양한 서비스를 카테고리별로 나열한 메뉴입니다. 여기에서 'EC2'를 선택하여 Amazon Elastic Compute Cloud 대시보드로 이동합니다. EC2는 가상 서버를 생성하고 관리할 수 있는 서비스입니다.EC2란?Amazon EC2(Elastic Compute Cloud)는 아마존 웹 서비스(AWS)가 제공하는 클라우드 기반의 가상 컴퓨팅 서비스입니다. EC2를 사용하면 사용자는 물리적인 하드.. 공감수 1 댓글수 0 2024. 7. 28.
  • Union-Find Algorithm (유니온 파인드 알고리즘) 탬플릿 코드 Union-Find Algorithm (유니온 파인드 알고리즘) 탬플릿 코드n, m = map(int, input().split())parent = [0] * (n + 1)for i in range(n + 1): parent[i] = idef find(node): if node != parent[node]: parent[node] = find(parent[node]) return parent[node]def union(a, b, parent): pa = find(a) pb = find(b) if pa == pb: return if a > b: parent[pa] = pb else: par.. 공감수 0 댓글수 0 2024. 7. 21.
  • 여러 브랜치를 관리 해야 하고, git pull 함부로 써서 충돌 처리를 하기 힘들 때 좋은 방법 git pull origin  충돌이 일어났을 때 흔히 위의 코드를 써서 충돌을 처리하고는 한다. 하지만 때때로 브랜치끼리 따로 관리 되어 하나의 브랜치가 다른 모양의 프로젝트일 수 있다. 그렇기 어느 프로젝트에 종속되있는 브랜치를 따기 어려운 상태고, 이런 상황에서 충돌 처리하려고 하면 어려운 상황이 놓일 때가 있다. 보통 가중 단순한 해결 방법은 merge하고자 하는 저장소 코드를 복사해서 내꺼에 붙이고, merge한 다음 따로 저장 해둔 new source를 다시 붙이는 방법이 있다. 그런데 이방법을 써도 계속 충돌 나는 상황이 존재한다. 이런 상황일 때,  강제적으로 그냥 넣어 주고 싶은 욕구가 마구 솟아오른다. 이럴 때 해결 방법이git checkout origin/dev -- src/compo.. 공감수 0 댓글수 0 2024. 6. 28.
  • 다익스트라 탬플릿 코드 from heapq import heappush, heappopv, e = map(int, input().split())st = int(input())graph = [[] for _ in range(v + 1)]distance = [99999999] * (v + 1)distance[0] = 0for i in range(e): x, y, val = map(int, input().split()) graph[x].append([val, y])def dijkstra(graph, num, distance): q = [] heappush(q, [0, num]) distance[num] = 0 while q: w, number = heappop(q) if w .. 공감수 0 댓글수 0 2024. 6. 18.
  • dfs, bfs 탬플릿 코드 DFS (좌표 형태 순회용)def dfs(x, y): dx = [-1, 0, 1, 0] dy = [0, 1, 0, -1] for i in range(4): nx = x + dx[i] ny = y + dy[i] if isRectangle(nx, ny) and copyed_maps[nx][ny] == 1 and chk[nx][ny] == -1: chk[nx][ny] = 1 dfs(nx, ny)def isRectangle(x, y): if 0  DFS ( 노드와 노드 순회용)n = int(input())connects = int(input())connectList = [[0] * (n + 1) for _ in r.. 공감수 0 댓글수 0 2024. 6. 11.
  • 깃 체리픽 하는 방법 https://chat.openai.com/share/3987fbaf-05fc-4124-83e6-28e9409941a3 ChatGPTA conversational AI system that listens, learns, and challengeschat.openai.com 기본이 되는 브랜치 : main병합 목적 브랜치: dev내가 작업한 브랜치: coding-dev main 이 운영계 dev가 개발계이고, 이렇게 있을 때 main을 기준으로 coding -dev를 딴 다음 dev에 반영하고, 나중에 작업을 모아서 dev => main에 병합하는 방식으로 작업한다고 생각해 보자. 이럴 때 coding-dev에서 작업을 한 후, coding-dev => dev로 머지하려고 할 때 모종의 이유르 내가 작업한.. 공감수 1 댓글수 0 2024. 5. 16.
  • 맨날 헷갈리는 PaaS, IaaS, SaaS 요약 PaaS (Platform as a Service)설명: 애플리케이션 개발 및 배포를 위한 플랫폼을 제공하는 서비스.예시: Heroku, Google App Engine.주요 기능: 개발 환경, 데이터베이스 관리, 미들웨어 등.IaaS (Infrastructure as a Service)설명: 가상화된 컴퓨팅 자원을 제공하는 서비스.예시: Amazon Web Services (AWS), Microsoft Azure.주요 기능: 서버, 스토리지, 네트워크 자원.SaaS (Software as a Service)설명: 인터넷을 통해 소프트웨어를 제공하는 서비스.예시: Google Workspace, Salesforce.주요 기능: 소프트웨어 접근, 유지관리, 업데이트.각 서비스의 핵심은 다음과 같습니다:Pa.. 공감수 0 댓글수 0 2024. 5. 10.
  • 다익스트라 알고리즘 - 배열에 cost가 주어질 시 탬플릿 코드 import heapq import sys input = sys.stdin.readline cnt = 1 INF = int(1e9) dx = [-1, 1, 0, 0] dy = [0, 0, -1, 1] def dijkstra(): q = [] heapq.heappush(q, (graph[0][0], 0, 0)) distance[0][0] = 0 while q: cost, x, y = heapq.heappop(q) if x == n - 1 and y == n - 1: print(f'Problem {cnt}: {distance[x][y]}') break for i in range(4): nx = x + dx[i] ny = y + dy[i] if 0 공감수 0 댓글수 0 2024. 1. 28.
  • 웹 개발 관련 - 알아두면 유용한 명령어 및 오류 해결 윈도우에서는 깃파일 이름 길이 관련해서 길어지면 오류가 납니다. 그리고 길이에 관련한 명령이 기본적으로 false로 설정 되있는 듯 합니다. 그렇기 때문에 정삭적으로 깃을 클론 도는 풀을 받았음에도 불구하고 관련한 오류가 나온다면 아래의 명령어를 치시길 바랍니다. git config --system core.longpaths true 또 어떨때는 아직 쿠키나 로컬저장소에 값을 저장해서 써야하는데 해당 관련 api가 나오지 않아서 수동으로 저장해야할 때 가 있습니다 이럴때 개발자창에가서 일일이 치기는 번거로운데 콘솔창에 관련한 명령어가 존재합니다. // key, value 형식으로 값 넣기 document.cookie="key=value" 공감수 0 댓글수 0 2024. 1. 3.
  • 자바스크립트는 왜 그 모양일까? 시작 이 책은 자바스크립트를 철저하게 ‘프로그래밍 언어’ 관점에서 접근하고 있다. 엔진이나 웹의 구동 환경 등을 다루지 않고, 언어 자체에 대해 모든 개발자가 알아야 할 것들을 다룬다. 오히려 배우는 사람이 그런 것을 알지 않기를 바란다. “언어의 간결하고 분명한 부분만 가까이 하라” 는 것이 필자의 주장이며, 자바스크립트는 그렇지 않은 부분이 충분히 많다. 책 전반에 걸쳐서 이야기하는 부분 중 하나가 “다음 세대의 프로그래밍 패러다임은 ‘분산 비동기 프로그래밍’ 이 될 것이다” 이다. 그리고 자바스크립트는 그 과도기적 언어로서 충실하게 역할을 수행하고 있다고 볼 수 있다. 챕터별 메모 너무 어려워서 개념적인 부분만 그리고 내가 납득 가능한건만 정리 했다. 납득이 가지 않거나 하는건 혹시 내가 이해를 제.. 공감수 0 댓글수 1 2023. 12. 20.
  • Today I Learned : Vue.js 랜더링시 해결 과정 중 배운 것 정리 어제 Do it! 프런트엔드 UI 개발 with Vue.js의 구현을 모두 끝냈다. 해당 책을 기획이자 디자인, 와이어프레임이라고 생각하고 했던 사이드 프로젝트가 끝이 났다. 그리고 오늘부터 좀 더 프런트엔드답게 고정 데이터인 부분을 => axios 호출해서 가져오는 형태 또는 모듈화 및 추상화를 넣어주는 리팩토링을 시작하고자 했다. 과정에서 몇 가지의 문제점이 생겼습니다. 또 해결해 가면서 배운 것들을 정리하는 과정을 가져볼까 합니다. 0. 이전에 구현 중 localhost:5147/ 로 이동시 index.vue로 이동하게 라우팅이 되어 있었습니다. 하지만 index.vue는 아래와 같이 구현되어 있었습니다. 웹사이트 제목 이렇기 때문에 path: "/"으로 갈 경우 content가 비어있는 페이지가 .. 공감수 1 댓글수 0 2023. 12. 18.
  • 컴파일 해주는 사이트 - 공부 시 편리 공부하면서 내가 설치 하지 않는 언어가 예시로 나오거나 할 때 가있다. 잘 보지 않던 문법 형식이라 이해하는데 시간이 걸릴 수 있는데 이럴때 한 번 돌려보면 빠르게 알텐테... 이럴것이다. 그렇다고 그걸 돌려보려고 설치하고 하는 일(?) 너무나도 귀찮다. 그럴때 여러 언어를 대신 돌려주는 사이트를 찾았다. https://www.mycompiler.io/ko myCompiler - C, C++, 자바, 파이썬, 고, NodeJS 및 기타 언어를 위한 온라인 IDE myCompiler를 사용하여 자주 사용하는 프로그래밍 언어를 온라인으로 실행하세요.원하는 프로그래밍 언어로 코드를 편집, 컴파일 및 실행할 수 있는 간단하고 사용하기 쉬운 IDE www.mycompiler.io 공부하면서 도움이 되길 바란다. .. 공감수 0 댓글수 0 2023. 12. 18.
  • 다익스트라 템플릿 ### 다익스트라 알고리즘 탬플릿 ### n, m = map(int, input().split()) k = int(input()) graph = [[] for _ in range(n + 1)] visited = [False] * (n + 1) distance = [99999] * (n + 1) for i in range(n + 1): a, b, c = map(int, input().split()) graph[a].append((b, c)) def getSmallestNode(): minValue = 99999 index = 0 for i in range(1, n + 1): if not visited[i] and distance[i] < minValue: minValue = distance[i] index.. 공감수 0 댓글수 0 2023. 12. 15.
  • html 에서 html 로 데이터 보내기 with 바닐라 자바스크립트 # 리액트나 뷰 이런 프레임워크에서는 props로 데이터를 간단하게 보낸다. 그런데 문득 그러한 프레임워크를 쓰지 않고, 어떤 식으로 데이터를 보낼지가 궁금하다. 또한 가끔 일을 하다 보면 그러한 코드를 마주할 때가 있다. 그런 상황에서 좀 더 쉽게 어려움을 해결하고자 이 글을 정리한다. ## 들어가기에 앞서 우선 로컬스토리지, 세션, 쿠키로 저장해서 가져다 쓰는 방법은 언급하지 않겠다. 또한 서버가 있다고 가정하고 서버에 데이터를 보내고 받아오는 형식도 고려하지 않겠다. 단순히 두 html 간에 데이터를 간단하게 전송하고자할 때의 상황을 고려하겠다. #### 보내는 페이지: pageA.html Send Message from Page A ##### 설명 간단한 코드이다. sendButton을 id로 가.. 공감수 1 댓글수 1 2023. 12. 8.
  • React, Vue를 구현하면서 어렵고, 지금도 어려운점 회고 개인적으로 React든 vue든 뭐가 됬든 HTTP 비동기 통신을 하는 과정에서 여러 HTTP통신이 섞이면서 내가 원하는 타이밍에 랜더링이 되지 않을 때 그리고 그러한 타이밍을 고치려고할 대 어려움을 느꼈다. 또는 어떤 모종의 과정에서 데이터가 씹혀서 나오지 않을 때, 아무리 봐도 로직적으로 나와야하는데 나오지 않아서 어떤 추가적인 코드를 첨부해야할 때 구현에 있어서 많은 시간이 소모 됬고, 어려움을 느꼈다. 현재는 이러한 어려움이 닥쳤을 때 쉽게 해결할 노하우가 없기 때문에 그런 상황이 올까봐 두렵기만 하다. 공감수 1 댓글수 2 2023. 12. 5.
  • 커링 함수 커링(Currying)은 함수를 여러 인자를 받는 일련의 함수들로 변환하는 프로그래밍 기법입니다. 커링을 사용하는 이유는 여러 가지가 있습니다: // 주어진 함수 function sum(a, b, c) { return a + b + c; } // 커링 함수 정의 function curry(func, ...zeroth) { return function(...wunth) { return func(...zeroth, ...wunth); }; } // 커링 함수를 사용하여 부분적으로 값을 지정한 함수 생성 const curriedSum = curry(sum, 1); // 커링된 함수 호출 const result = curriedSum(2, 3); console.log(result); // 6 해당 커링 함수를 .. 공감수 0 댓글수 0 2023. 11. 30.
  • git 작업을 이전으로 되돌리는 방법들 내 소스 / 리포지토리가 git pull을 수행하기 전의 이전 상태가되도록 git pull을 되돌 리거나 실행 취소하는 방법이 있습니다. git pull 취소하고 되돌리기 git reset --hard git merge 취소하고 되돌리기 git reset --merge ORIG_HEAD git commit 취소하고 되돌리기 git reset --hard HEAD git add 취소하고 되돌리기 git reset HEAD 주의 이 섹션에 나열된 명령은 커밋되지 않은 모든 변경 사항을 제거하여 잠재적으로 작업 손실을 초래할 수 있습니다 공감수 0 댓글수 0 2023. 11. 20.
  • Git : 여러 프로젝트들 모음에서 새로운 프로젝트 추가 시 문제 해결 방법 [상황 설명] 저장소에 프로젝트를 모아놓고 작업을 하다보면 가끔 새로운 컴퓨터에서 새로운 프로젝트를 추가하고 git push를 하고 싶은 상황이 온다. 그러면 기존의 저장소에 여러 프로젝트들을 pull 땡기고, 거기다 내가 지금 작업한 프로젝트를 푸쉬하면 될거라고들 생각한다. 하지만 전혀 다른 컴퓨터에서 작업을 한거기 때문에 git은 이 프로젝트는 기존의 프로젝트랑 상관이 없는 거라 판단 거부한다. 이럴때 강제로 pull/ push 하는 방법을 알아보자! (pull 땡길 때 문제 상황) PS C:\Users\USER\ass> git pull origin main remote: Enumerating objects: 3, done. remote: Counting objects: 100% (3/3), done.. 공감수 3 댓글수 3 2023. 10. 25.
    728x90
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.