티스토리

노트

검색하기

블로그 홈

노트

blackmilkt.tistory.com/m

blackmilktea 님의 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

[클라우딩 어플리케이션 엔지니어링 TIL] - 9주차 React React SPA & CSRRouting: 어떤 네트워크 내에서 통신 데이터를 보낼 경로를 선택하는 일련의 과정Page Routing: 브라우저가 웹 서버에 경로의 요청을 보내고 웹 문서를 받아오는 과정Multipage Application(MPA): 여러 페이지를 이동할때마다 원하는 페이지 요청을 보내고 웹 서버가 응답하면 브라우저가 새로고침 되면서 화면이 깜빡임.Singlepage Application(SPA): 새로운 페이지를 요청해도 index.html만 반환하는 서비스 Client Side Rendering(CSR): 클라이언트(브라우저)가 알아서 직접 랜더링 하는 것.CSR은 새로운 페이지로 이동할 때 서버와 통신하지 않고 스스로 화면을 업데이트 하기 때문에 서버와의 통신 대기시간이 사라져 굉.. 공감수 0 댓글수 0 2024. 6. 13.
[클라우딩 어플리케이션 엔지니어링 TIL] - 7주차 고양이 검색 사이트 2 고양이 검색 사이트 만들기 2요구사항3. 검색 페이지 관련● 페이지 진입 시 포커스가 input 에 가도록 처리하고, 키워드를 입력한 상태에서 input 을 클릭할 시에는 기존에 입력되어 있던 키워드가 삭제● *데이터를 불러오는 중일 때, 현재 데이터를 불러오는 중임을 유저에게 알리는 UI를 추가더보기/* Loading.js */class Loading { $loading = null; data = null; constructor({ $target }) { const $loading = document.createElement('div'); this.$loading = $loading; $target.appendChild(this.$loading); this.data = {sh.. 공감수 0 댓글수 0 2024. 5. 30.
[클라우딩 어플리케이션 엔지니어링 TIL] - 7주차 고양이 검색 사이트 고양이 검색 사이트 만들기요구사항1. HTML, CSS 관련● 현재 HTML 코드가 전체적으로 로만 이루어진 이 마크업을 시맨틱한 방법으로 변경 => 의미없는 를 으로 변경● 유저가 사용하는 디바이스의 가로 길이에 따라 검색결과의 row 당 column 갯수를 적절히 변경 ○ 992px 이하: 3개 ○ 768px 이하: 2개 ○ 576px 이하: 1개@media screen and (max-width: 992px) { .SearchResult {grid-template-columns: repeat(3, minmax(250px, 1fr));}}@media screen and (max-width: 768px) { .SearchResult {grid-template-columns: rep.. 공감수 0 댓글수 0 2024. 5. 29.
[클라우딩 어플리케이션 엔지니어링 TIL] - 7주차 퍼즐게임 추가 요구사항 퍼즐 게임 명세서의 추가 기능 구현해 보기1. 난이도 선택요구사항3x3 뿐만 아니라 4x4, 5x5 등의 다양한 형태의 게임 옵션 구성clip-path나 canvas로 원본 이미지를 잘라서 출력하려고 했는데 생각보다 많은 처리가 필요해서 그냥 미리 4x4, 5x5로 나눠놓은 로컬 파일을 로드하기로 했다.function loadPuzzleImages() { while(puzzleContainer.firstChild) puzzleContainer.removeChild(puzzleContainer.firstChild) gameData.changeOriginalImageSet() gameData.generateImageIndexes() for (let i = 0; i loadP.. 공감수 0 댓글수 0 2024. 5. 29.
[클라우딩 어플리케이션 엔지니어링 TIL] - 7주차 리팩토링 리팩토링(Refactoring)리팩토링은 주로 가독성을 높이고 유지보수를 편하게 하기 위해서 코드의 구조를 재조정하는 것을 뜻한다. 리팩토링을 통해 코드의 기반 구조를 단단하게 하고 코드의 이해도를 높일 수 있다면 소프트웨어가 어떻게 설계 되었는지 빠르게 파악할 수 있고 수정이 보다 간단해지며 버그가 발생했을 경우 찾기 쉬워진다. 즉. 리팩토링은 소프트웨어의 설계, 구조 및 구현을 개선하기 위한 고민이라고 할 수 있다.퍼즐 게임 리팩토링1. 조건문 단순화조건문을 보다 명확하게 구성// 이전에 선택한 이미지가 없다면if (!previouslySelecetedElement) {...}// 선택한 이미지가 있다면else { // 이전에 선택한 이미지와 현재 선택한 이미지가 같을 경우 if (previou.. 공감수 0 댓글수 0 2024. 5. 28.
[클라우딩 어플리케이션 엔지니어링 TIL] - 6주차 퍼즐 게임 퍼즐 게임 명세서 기반 실습1. 메인 페이지게임 시작 버튼 구현startButton.addEventListener('click', function () { // 게임 페이지 show const gameScreen = document.querySelector('.game-screen') gameScreen.classList.remove('hide') // 시작 페이지 hide const startScreen = document.querySelector('.start-screen') startScreen.classList.add('hide')}2. 게임 페이지1) 원본 이미지 로드startButton.addEventListener('click', function () { ... .. 공감수 0 댓글수 0 2024. 5. 25.
[클라우딩 어플리케이션 엔지니어링 TIL] - 6주차 프로젝트 명세서 프로젝트 명세서프로젝트 명세서란?프로젝트 목표와 범위구현해야 하는 기능, 디자인마감 기한 등이 포함된 상세 계획청사진, 설계도라고 할 수 있음필요한 이유개발자와 클라이언트의 의사소통 병목을 줄임팀 내의 프로젝트에 대한 공통 목표 설정즉 방향성을 올바르게 잡을 수 있도록 함포함되어야 하는 내용프로젝트 목표, 달성 범위프로젝트 일정프로젝트 상세 기능 명세, 플로우 차트테스트 계획배포 전략프로젝트 명세서를 읽고 개발을 잘 해내기 위해서는 다음고 같은 흐름으로 개발하는 것이 좋다.명세 확인문제 정의정의한 문제를 통해 요구사항 분석분석한 요구사항을 기반으로 대략적인 코드(ex: pseudo-code) 흐름 작성실제 코드 작성에러가 발생하면 2~4번에서 문제가 있는지 확인 후 5번을 다시 확인퍼즐 게임 명세서를 읽.. 공감수 0 댓글수 0 2024. 5. 24.
[클라우딩 어플리케이션 엔지니어링 TIL] - 6주차 피그마3 피그마 프로토타입 실습디자인 가이드라인 IOS, Android 각각의 운영 체제는 제조사에서 제공하는 디자인 가이드라인이 있으므로 앱을 디자인할 시 읽어보는 것이 좋음. 양이 많으므로 필요시 요약본 읽기애플의 Human Interface GuidelinesGoogle Material Design 3 디자인 리소스 피그마 커뮤니티에서 IOS와 Android에 어울리는 디자인 리소스를 구해 쉽게 화면을 구성할 수 있다.IOS 17 디자인 리소스Material 3 디자인 리소스 언스플래시: 고화질 이미지 무료 제공 피그마에서 플러그인으로도 사용 가능 로컬 폰트: 브라우저에서 피그마를 사용하는 경우 아래 링크에서 font installer를 통해 다운받아야만 컴퓨터에 저장된 로컬 폰트를 사용 가능https:.. 공감수 0 댓글수 0 2024. 5. 24.
[클라우딩 어플리케이션 엔지니어링 TIL] - 6주차 피그마2 피그마 심화오토 레이아웃(Auto layout)객체들을 선택 후 Shift + A로 오토레이아웃을 설정해 하나의 프레임으로 묶을 수 있다.오토 레이아웃으로 묶인 객체들은 각 객체의 정렬 방식, 여백 등을 빠르고 동시에 제어할 수 있고, fixed, hug, fill 옵션을 통해 리사이징 할 수 있다. 또한, drag & drop 형식으로 레이아웃 배치가 가능해 심플하게 조작 가능하다는 장점이 있다. Fixed: 고정된 넓이나 높이Hug: 자신의 레이어를 감싸는 영역Fill: 부모 프레임의 크기에 맞춰 크기를 늘리거나 줄임. 최상위 부모는 Fill이 없으며, 자식 객체가 여럿일 때는 부모 영역을 균등하게 나눠서 크기를 가져감.컴포넌트(Component)재사용 가능하게 저장한 디자인저장된 컴포넌트는 사이드바.. 공감수 0 댓글수 0 2024. 5. 21.
[클라우딩 어플리케이션 엔지니어링 TIL] - 6주차 피그마 피그마(Figma)피그마는 macOS 및 윈도우용 데스크톱 애플리케이션들에 의해 활성화되는 추가 오프라인 기능들을 갖춘 인터페이스 디자인을 위한 협업 웹 애플리케이션이다. 피그마의 기능 집합은 UI와 UX 디자인에 초점을 두며 실시간 협업, 다양한 벡터 그래픽스 편집기 및 프로토타이핑 도구들을 활용한다.포토샵 등에서 사용하던 기존의 비트맵 방식과 달리 피그마는 백터 기반이기 때문에 확대해도 깨지지 않는 특성을 가지고 있다. 피그마 단축키는 피그마 내에서 Ctrl + Shift + / 로 확인할 수 있다. 공감수 0 댓글수 0 2024. 5. 20.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 22 (가계부 기능 추가3) 토스 앱을 이용하다 카드 지출 내역을 달력으로 표시하는 기능을 보고가계부에 추가해 보면 좋겠다 싶어서 한 번 시도해 봤다.달력 기능을 추가하고 보니 달력까지 노출되었을 때, 총지출과 수입 표시가 좀 난잡합 느낌이 들어서현재 자산에 마우스 커서를 올려놓았을 때만 보이도록 수정했다. 카테고리 옆에 달력 버튼(📅)을 추가해서 클릭했을 때 달력이 보이게 했고,기본적으로 달력은 현재 날짜에 해당하는 달과 날짜를 출력한다.월지출은 해당 달의 지출의 합을 나타내고 모든 수입은 초록색, 일반적인 지출은 회색, 가장 많은 지출을 한 날짜의 금액은 빨간색으로 표시했다.달력의 날짜 칸을 클릭하면 선택한 날짜의 상세 소비 내역을 출력하고이전날이나 다음날로 넘어가면 월지출이 갱신된다.X 버튼을 눌러 달력을 닫을 수 있으며 .. 공감수 0 댓글수 0 2024. 5. 16.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 21 투포인터일차원 배열에 두 개의 포인터를 두고 조작하는 알고리즘, 연속적인 구간 계산을 할때 많이 사용투포인터 알고리즘 문제 풀기보석 쇼핑: https://school.programmers.co.kr/learn/courses/30/lessons/67258 보석 쇼핑 문제는 모든 보석을 살 수 있는 가장 짧은 진열대 구간을 찾아서 return 하는 문제이기에 일차원 구간에 대한 탐색을 투포인터 알고리즘으로 접근해 풀 수 있다. 진열된 모든 종류의 보석을 적어도 1개 이상 포함하는 구간을 찾는 것이 목적이기 때문에 다음과 같이 진행한다.start, end 인덱스를 첫번째 인덱스에 위치시킨다.두개의 포인터가 가르키는 현재 구간에서 모든 보석을 구매할 수 없다면 end 인덱스를 증가현재 구간에서 모든 보석을 구매.. 공감수 0 댓글수 0 2024. 5. 14.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 20 힙(Heap)최댓값(Max) 또는 최솟값(Min)을 찾아내는 연산을 빠르게 하기 위해 고안된 완전이진트리(Complete binary tree)의 일종이다. 힙에서는 가장 높은(또는 가장 낮은) 우선순위를 가지는 노드가 항상 뿌리 노드에 오게되는 특징이 있어며, 이를 이용해 우선순위 큐(Priority Queue)를 구현할 때 내부적으로 이용하는 자료구조이다.힙의 종류최대 힙(Max Heap): 모든 노드가 자식 노드보다 작거나 같은 값을 가지는 힙최소 힙(Min Heap): 부모 노드의 값이 자식 노드의 값보다 작거나 같은 값을 가지는 힙최소 힙(Min Heap) 구현최소 힙을 구현하는데 필요한 삽입 연산 힙의 마지막 노드에 새로은 노드 추가새로운 노드를 추가한 위치에서부터, 부모 노드와 새로 추가된 .. 공감수 0 댓글수 0 2024. 5. 13.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 19 소수 판별하기현재 숫자가 소수인지 판별하는 알고리즘을 작성할 때가장 단순한 방법은 n까지 반복문을 돌면서 1 이외의 약수가 있는지 확인하는 것이다.function isPrime(n) { for (let i = 2; i 이 알고리즘의 시간복잡도는 O(n) 여기서 조금 최적화를 해보자면특정 수의 약수는 가운데 약수를 기준으로 대칭성을 가지므로 제곱근까지만 확인해 보면 된다.ex) 16 => 1, 2, 4, 8, 161 x 16 = 162 x 8 = 164 x 4 = 16function isPrime(n) { for (let i = 2; i * i 최적화한 알고리즘의 시간복잡도는 O(sqrt(n))여기서 더 최적화할 수도 있지만 판별해야 할 수가 많지 않을 땐 이런 단순한 코드로도 충분하고,많은 수.. 공감수 0 댓글수 0 2024. 5. 10.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 18 자바스크립트 9가지 코드 트릭1. 구조 분해 할당을 이용한 변수 swaplet a = 5, b = 10;[a, b] = [b, a];console.log(a, b); // 10 52. 배열 생성으로 루프 제거일정 범위 루프에 대한 계산은 보통 다음과 같이 작성하지만let sum = 0;for (let i = 5; i 배열을 생성해서 redece 메서드를 통해 계산할 수 있음.const sum = Array .from(new Array(5), (_, k) => k + 5) .reduce((acc, cur) => acc + cur, 0);3. 배열 중복 제거const numbers = [2, 13, 4, 4, 2, 13, 13, 4, 4, 5, 5, 6, 6, 7, 5, 32, 13, 4, 5];.. 공감수 0 댓글수 0 2024. 5. 9.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 17 (가계부 기능 추가2) 앞으로 약 2주간 코딩 테스트를 위한 알고리즘 강의를 진행해서남는 시간에 지난 내용 복습할 겸 가계부를 좀 더 개선해 봤다.1. 총지출, 수입 추가현재 자산 아래쪽에 소비 내역의 총지출과 수입을 추가하여 재정 상황을 빠르게 파악할 수 있다.handleGetConsumptionDetails 안에서 소비 내역 리스트들을 구성할 때 지출과 수입의 합도 같이 계산해서소비 내역을 추가, 삭제할 때 알아서 다시 갱신 하도록 했다.const $totalMinusValue = document.querySelector(".total-minus-value");const $totalPlusValue = document.querySelector(".total-plus-value");const handleGetConsumpti.. 공감수 0 댓글수 0 2024. 5. 8.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 16 알고리즘 공부하는 법문제를 풀 때 중요한 것여러 가지 풀이 방법이 있을 수 있으므로 다양한 방식으로 문제에 접근.항상 예외가 있을 수 있음. 반례 생각해 보기.풀어낸 답이 베스트인지 고민하고, 더 효율적인 풀이 찾기.시행착오를 기록하기. 다른 비슷한 문제가 나와도 접근하기 쉬워짐.풀었더라도 다른 사람 코드 살펴보기, 생각하지 못했던 방법을 발견할 수 있음.쉽게 포기하지 않기. 그러나 알고리즘을 모르면 아예 못 푸는 문제도 있고, 시간이 너무 오래 걸리거나 도저히 못 풀겠다면 답을 보는 것도 방법재밌게 공부하는 법시각적인 사이트의 도움자료구조, 알고리즘을 공부할 때 어디에 응용될 수 있는지 생각해 보면서 공부하기마음가짐코테는 문제 해결 능력을 확인하는 것이므로 알고리즘 마스터가 될 필요는 없음.논리적 사고.. 공감수 0 댓글수 0 2024. 5. 7.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 15 (가계부 기능 추가) 이번주는 JS가 서버와 통신을 위해 사용하는 API 통신 과정을 비동기적으로 동작하는 async - await 패턴을 이용해 가계부 페이지를 구현했다. 강의를 따라가며 가계부 기능을 구현하면서 개념적으로만 알고 있었던 API 통신에 대해 배울 수 있어서 좋았다. 개인적으로 가계부 기능을 일부 수정, 추가하고 삭제 API도 사용해 보았다. 1. 날짜 입력 기능1-1) 날짜 입력 필드 추가각 날짜의 default value는 현재 시간을 기준으로 년, 월, 일 설정const initForm = () => { ... // 날짜 value 초기화 $yearInput.value = today.getFullYear(); $monthInput.value = today.getMonth() + 1.. 공감수 0 댓글수 0 2024. 5. 5.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 14 Tech Spec(기술 설명서)기술적으로 어떻게 구현할지 정리한 내용Tech Flow기술적인 Flow는 5단계로 나눌 수 있음.서비스에 접근한다.유저가 액션을 하면, 서비스는 액션을 입력한다.입력받은 데이터를 서버에 저장한다,현재 데이터를 서버로부터 가져온다.서버로부터 받은 데이터를 화면에 보여준다.3가지 레이어위 단계에선 3가지 레이어가 상호작용 함.웹/유저/서버 간 상호작용을 인터렉션이라고도 함.웹 -> 유저: 화면을 보여준다.(렌더링)웹 웹 -> 서버: 데이터 조회, 저장, 수정 등을 요청한다.웹 이렇게 인터렉션을 기준으로 구분하여 코드 구조화 할 수 있음.렌더링렌더링은 크게 2가지 방향으로 나뉨. 기본 렌더링(웹 사이트에 처음 방문했을 때)html 파일에 문서를 작성최초 파일이 로드될 때, 브라우.. 공감수 0 댓글수 0 2024. 5. 2.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 13 김동영 강사님이 학습법에 대해 짧게 강의해 주셨다.개발자의 학습법에 대한 미니세션경험여러 종류의 경험을 통해 지식을 얻는 것은 각각 학습하는 데 걸리는 시간도, 기억에 남는 정도도 다름.시간이 지남에 따라 기억을 망각하게 됨.따라서 복습을 통해 자꾸 이끌어내야 학습한 지식이 기억에 오래 남음.또한, 저장된 지식을 활용하는 연습을 꾸준히 해야 필요할 때 적절히 응용할 수 있음.인지메타 인지: 인지에 관한 인지, 무엇을 알고 무엇을 모르는지 아는 것.인지 상태를 크게 4가지로 나누면 아래와 같이 나눌 수 있음.지식지각1. 모르는 것을모르는 상태2. 모르는 것을 아는 상태3. 아는 것을 아는 상태4. 아는 것을모르는 상태 나의 지식이 어떠한지 "아는 상태"에 먼저 도달하려고 해야 함.측정나의 상태를 파악하기 .. 공감수 0 댓글수 0 2024. 5. 1.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 12 JavaScript예외 상황(Exception)런타임 때 발생할 수 있는 의도치 않은 상황흐름 제어 시 발생할 수 있는 예외 상황이므로 이를 이해하여 코드 레벨에서 대응해야 함.예외 상황을 핸들링하지 않는다면 기능이 동작하지 않거나 애플리케이션이 shout down 될 수 있음.예외의 원인언어 레벨에서부터 외부 요인까지 다양코드 레벨하드웨어, 디바이스 문제라이브러리 손상사용자의 입력 실수예외의 종류ECMAScript Error자바스크립트 언어에서 발생하는 Error TypeRangeError: 값이 집합에 없거나, 허용 범위가 아닐 때ReferenceError: 존재하지 않는 변수 참조 시SyntaxError: 문법을 지키지 않았을 때TpyeError: 값이 기대한 자료형이 아니어서 연산이 불가능할 때D.. 공감수 0 댓글수 0 2024. 4. 30.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 11 JavaScript브라우저 개발자 도구F12 키 또는 Ctrl + Shift + i를 누르면 확인할 수 있으며, 여러 탭으로 나뉨.Elements: 로드된 파일의 소스Console: 자바스크립트를 실행시킬 수 있음.Sources: 현재 브라우저에 로딩된 모든 소스코드를 확인 가능Network: 네트워크 통신이 일어났을 때 네트워크 통신 로그 확인 가능Performance: 웹의 성능을 확인Memory: 메모리 누수 등을 확인 가능Application: 브라우저의 저장 기능을 확인이외에 Securiy, Lighthouse, Recorder, Performance insights 등의 기능이 있음브라우저 디버깅이슈(or bug, error): 개발 중에 발생하는 예기치 않은 상황디버깅: 이러한 이슈를 분석 .. 공감수 0 댓글수 0 2024. 4. 29.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 10 이번주 강의에선 HTML의 여러 태그들과 CSS 등을 사용하여 반응형 웹 대해 알려주셨다.개인적인 실습으로 지인이 모바일 명함 관련 플젝을 한 번 해보자고 해서일단 생각나는 대로 틀만 만들어 봤다.아직 여러 이벤트를 등록하지 않아서 동적인 움직임 없이 고정된 상태이지만요소들의 배치와 눌렀을 때 어떻게 변화시킬지를 생각하고 코드를 작성하는데 굉장히 오래 걸렸다.구현하고 싶은 디자인과 기능은 많지만 머릿속에 있는 걸 표현해 내는 구현력이 많이 부족한 것 같다 :( 오늘은 여기까지 내일 자격증 시험부터 끝내고,, 공감수 0 댓글수 2 2024. 4. 26.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 9 강의 내용 중 CSS를 통한 이미지를 넣을 때 div에 background로 링크를 추가하고 거기서 크기와 위치를 조절하는 방법을 보고 꽤 괜찮은 방법이라고 느꼈다. 대부분의 상황에서 이미지는 프로필 사진, 배경사진, 버튼의 아이콘 등으로 요소의 구조안에 이미지를 사용할테니 단독으로 이미지만 사용하는 경우가 아니라면 HTML의 img태그를 사용하는 것보다 직관적인 방법인 것 같다. 그리고 오늘 멘토님과 커피챗에서 내가 작성한 사전 질문들이 좀 딱딱한 것 같아서 걱정하고 있었는데 편히 말할 수 있게 무겁지 않은 분위기로 이끌어 주셔서 감사했다. 오늘 커피챗을 내용은 크게 두 가지인 것 같다.1. 커뮤니케이션은 매우 중요한 능력! 개발자는 팀원뿐만 아니라 타 팀과 협업도 많이 하고 사용자와도 소통해야 하.. 공감수 0 댓글수 0 2024. 4. 25.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 8 HTML 작성시 주의사항1. 대소문자 주의하기태그는 가능한 소문자로 작성2. 닫는 태그 생략 주의콘텐츠를 가지는 태그는 닫는 태그가 필수적3. 한글 사용 주의개발은 영어로 작성하기4. id는 중복되지 않도록 할 것id는 한 문서, 한 페이지 내에 한 번만 나와야 하는 고유한 것5. 계층 구조 유지코드는 가독성이 좋아야 함.계층을 잘 지키면서 개발하면 코드가 복잡해졌을 때 유지보수를 하기가 훨씬 수월 함.6. 동일한 의미의 태그 중첩 금지b와 strong 태그 중복 사용, a 태그 안에 button 태그의 중첩 등동일한 기능, 의미를 가지는 태그를 중첩해서 사용하는 건 지양해야 함. 공감수 0 댓글수 0 2024. 4. 24.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 7 Node.js에 DB 연동 후 데이터 조회, 삽입 먼저 docker를 통해 mariadb를 설치하고 Tennis라는 DB에 product 테이블을 생성했다. 그다음 연동할 node.js가 있는 터미널에서 npm install --save를 입력해 mysql을 설치하고, docker에서 mariadb를 설치할 때 user, password, port 번호 등을 'root', 3306 등으로 미리 설정했기 때문에 const mariadb = require('mysql'); const conn = mariadb.createConnection( { host: 'localhost', port: 3306, user: 'root', password: 'root', database: 'Tennis' } ); modul.. 공감수 0 댓글수 0 2024. 4. 23.
[클라우딩 어플리케이션 엔지니어링 TIL] - DAY 6 Node.js로 웹 서버 구현JavaScript와 Node.jsJavaScript는 이름처럼 독립적인 언어가 아닌 스크립트 언어이기 때문에 웹 브라우저 프로그램 안에서만 동작한다.웹 브라우저가 없으면 사용하기 어렵고, 웹에서 표시되는 부분은 JavaScript로 만들고 서버는 다른 언어로 구현해야 했는데 Node.js를 설치하면 브라우저 없이 터미널에서 실행할 수 있으며 서버도 구현할 수 있다. 즉, Node.js는 JavaScript를 프로그래밍 언어로 독립시키면서 백엔드를 구현할 수 있도록 지원하는 플랫폼이다. Node.js 실습을 하던 중 서버를 실행했는데Error: listen EADDRINUSE: address already in use :::8888포트 8888을 이미 사용 중이라는 에러가 .. 공감수 0 댓글수 0 2024. 4. 22.
11 응용 SW 기초 기술 활용 1. 운영체제의 특징운영체제(OS, Operating System)사용자가 컴퓨터의 하드웨어를 쉽게 사용할 수 있도록 인터페이스를 제공해 주는 소프트웨어메모리 관리 기법반입 기법: 메모리 적재 시기(When)배치 기법: 메모리 적재 위치(Where)할당 기법: 메모리 적재 방법(How)교체 기법: 메모리 교체 대상(Who)메모리 배치 기법최초 적합(First-fit): 프로세스가 적재될 수 있는 가용 공간 중, 첫 번째 분할에 할당최적 적합(Best-fit): 가용 공간 중에서 가장 크기가 비슷한 공간을 선택해 프로세스 적재최악 적합(Worst-fit): 프로세스의 가용 공간 중에서 가장 큰 공간에 할당페이지 교체 알고리즘LRU(Least Recently Used): 최근.. 공감수 0 댓글수 0 2024. 4. 21.
9 SW 개발 보안 구축 1. SW 개발 보안 설계SW 개발 보안 3대 요소기밀성(Confidentiality): 시스템 내의 정보와 자원은 인가된 사용자에게만 접근 허용무결성(Integrity): 시스템 내의 정보는 인가된 사용자만 수정 가능가용성(Abailability): 인가받은 사용자는 시스템 내의 정보와 자원을 언제든 사용 가능Dos(Denial of Service) 공격시스템을 악의적으로 공격해서 해당 시스템의 자원을 부족하게 하여 원래 의도된 용도로 사용하지 못하게 하는 공격Dos 공격의 종류SYN 플러딩(Flooding): 서버의 동시 가용 사용자수를 SYN 패킷만 보내 점유하여 다른 사용자가 서버를 사용 불가능하게 하는 공격UDP 플러딩: 대량의 UDP 패킷을 만들어 임의의 포트 번호로 전송.. 공감수 0 댓글수 0 2024. 4. 20.
7 애플리케이션 테스트 1. 애플리케이션 테스트 케이스 설계애플리케이션 테스트: 잠재되어 있는 결함을 찾아내는 일련의 행위 또는 절차애플리케이션 테스트 원리테스팅은 결함이 존재함을 밝히는 것: 결함을 줄일 순 있지만, 결합이 없다고 증명할 수 없음완벽한 테스팅은 불가능: 무한 경로, 무한 입력 값으로 인한 어려움개발 초기에 테스팅 시작: 테스팅 기간 단축, 재작업 감소로 개발기간 단축 및 결함 예방[결함의 집중] 파레토 법칙(Pareto Principle): 20%에 해당하는 코드에서 전체 결함의 80%가 발견된다는 법칙살충제 패러독스(Pesticide Paradox): 동일한 테스트를 반복하면 새로운 버그를 찾지 못함정황 의존성: 소프트웨어 성격에 맞게 테스트 실시오류-부재의 궤변: 요구사항을 충족시키지 못.. 공감수 0 댓글수 0 2024. 4. 19.

문의안내

티스토리
로그인
고객센터

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