All contents

Vue 3부터는 vite 기반으로 프로젝트가 생성됩니다. 오늘은 npm과 yarn이 있다고 가정하고 프로젝트를 세팅하도록 하겠습니다. 기본적인 세팅을 함께하고, 제가 하는 프로젝트 초기 세팅도 함께 해보겠습니다. Vue 3 생성하기 npm create vite@latest 위 명령어를 입력하면 여러가지 설정을 할 수 있습니다. 그리고 yarn을 입력해서 패키지를 설치합니다. yarn success가 뜨고, yarn lock 파일이 생긴 것을 볼 수 있습니다. 이제 실행해봅시다. yarn dev http://localhost:5173/ 에 접속해봅시다. 이렇게 간단히, 프로젝트를 생성하였습니다. 화면에 보이는 것처럼 VS CODE에 Volar를 설치하는 것이 더 편합니다. Ant Design Vue 적용하..

DDL (Data Definition Language) 데이터 정의어 데이터베이스 객체(table, view, index ... )의 구조를 정의 테이블 생성, 컬럼 추가, 타입 변경, 제약 조건 지정, 수정 등 create 데이터베이스 객체 생성 drop 데이터베이스 객체 삭제 alter 기존에 존재하는 데이터베이스 객체 수정 데이터베이스 생성 create Charater set은 각 문자가 컴퓨터에 저장될 때 어떠한 '코드'로 저장될지에 대한 규칙의 집합 의미 Collation은 특정 문자 셋에 의해 데이터베이스에 저장된 값들을 비교 검색하거나 정렬 등의 작업을 위해 문자들을 서로 '비교'할 때 사용하는 규칙들의 집합을 의미 # 기본 생성 create database 데이터베이스명; # 다국어 처리 ..

1. 그래프의 최단 경로 그래프의 최단 경로를 구할 때 가중치가 없다면 아묻따 BFS를 하면 된다. 있다면, 양의 가중치만 있다면 다익스트라 음의가중치도 있다면 벨만포드를 사용하면 됩니다. 플로이드 워샬 알고리즘도 음의 가중치를 허용합니다. ' 2. 모든 쌍 최단 경로 이 문제의 초록색 경로처럼, 최단경로를 찾는 문제. 최단 경로 문제 예시 한 도시에서 다른 도시로 가장 빨리 갈 수 있는 경로 찾기 가중치 포함, 방향성 그래프에서 최단 경로 찾기 최적화 문제 brute-force 접근 방법 한 정점에서 다른 정점으로의 모든 경로를 구한 뒤, 그들 중에서 최단 경로를 찾는다. 그래프가 n개의 정점을 가지고 있고, 완전그래프라고 가정하면 한 정점 i에서 어떤 정점 j로 가능 경로들을 다 모아 보면, 그 경로..

SSAFY 프론트엔드 과목평가를 준비중인 여러분들을 위한 내용 정리입니다. ૮꒰˶ฅ́ ˘ฅ̀˶꒱ა 1. HTML HTML 주요 태그 HTML은 웹 페이지의 구조를 정의하는 마크업 언어입니다. 주요 태그에는 , , ~, , , , , , , , 등이 있습니다. 각 태그는 특정한 속성을 가질 수 있습니다. 예를 들면, 태그의 href 속성은 링크의 주소를 지정합니다. Web Storage Web Storage는 웹 브라우저에서 키-값 쌍을 저장하는 클라이언트 사이드의 저장소 기술입니다.Web Storage는 localStorage와 sessionStorage으로 나뉩니다 localStorage 데이터는 브라우저를 닫거나 컴퓨터를 재부팅해도 영구적으로 저장됩니다. 도메인과 프로토콜에 따라 고유하며, 다른 도메..

개요SSAFY에서 프론트 수업을 한 지도 3일이 되었습니다. 같은 반 사람들의 코드리뷰를 해주면서 알게 된 공통적인 실수들을 모아보았습니다.사실 저도 이번에 알려주면서 새로 알게 된 부분들도 많답니다! 😂함께 체크해보아요!  1. HTML과 CSS의 역할 분리를 명확히 해주세요.HTML  : HyperText Markup Language의 약자로, 웹 페이지의 구조와 콘텐츠를 정의하는데 사용CSS    : Cascading Style Sheets의 약자로, 웹 페이지의 스타일을 정의하는 데 사용HTML은 구조와 콘텐츠 정의를 하는 데 사용되어야 합니다.이 말 뜻은, 태그 사용시 스타일을 고려하지 말고 콘텐츠에 집중하여야 한다는 말입니다. 가장 많이 하는 실수가, 중요하지는 않아도 디자인에서 글씨가 크다..

개요 오늘은 CSS를 처음 배울 싸피 친구들을 위해 초간단 요약본을 준비해보았습니다. 교육과정에 CSS가 있긴 하지만, 처음 배우는 친구들은 짧은 시간에 지나가는 수업만 듣고 코딩하기는 많이 어려우실거에요. 미리 한번 훑고 수업을 들으면 더 좋을겁니다! 이 글 내용을 외우지 못하더라도 과제를 할 때 검색하며 할 수 있으실겁니다. CSS 겁내지 말아요! CCS란 무엇인가요? 정의 CSS (Cascading Style Sheets)는 웹 페이지의 디자인과 레이아웃을 정의하는 언어입니다. HTML은 웹 페이지의 구조와 내용을 정의하는 반면, CSS는 그 내용이 어떻게 보여질지를 정의합니다. 간단히 말해, CSS는 스타일을 지정하여 웹 페이지를 아름답게 꾸미기 위해 사용됩니다. CSS의 작동 방식 CSS는 선택..

문제 RGB거리에는 집이 N개 있다. 거리는 선분으로 나타낼 수 있고, 1번 집부터 N번 집이 순서대로 있다. 집은 빨강, 초록, 파랑 중 하나의 색으로 칠해야 한다. 각각의 집을 빨강, 초록, 파랑으로 칠하는 비용이 주어졌을 때, 아래 규칙을 만족하면서 모든 집을 칠하는 비용의 최솟값을 구해보자. 1번 집의 색은 2번 집의 색과 같지 않아야 한다. N번 집의 색은 N-1번 집의 색과 같지 않아야 한다. i(2 ≤ i ≤ N-1)번 집의 색은 i-1번, i+1번 집의 색과 같지 않아야 한다. 입력 첫째 줄에 집의 수 N(2 ≤ N ≤ 1,000)이 주어진다. 둘째 줄부터 N개의 줄에는 각 집을 빨강, 초록, 파랑으로 칠하는 비용이 1번 집부터 한 줄에 하나씩 주어진다. 집을 칠하는 비용은 1,000보다 ..

문제 풀러 가기 10828번: 스택 첫째 줄에 주어지는 명령의 수 N (1 ≤ N ≤ 10,000)이 주어진다. 둘째 줄부터 N개의 줄에는 명령이 하나씩 주어진다. 주어지는 정수는 1보다 크거나 같고, 100,000보다 작거나 같다. 문제에 나와있지 www.acmicpc.net 문제 정수를 저장하는 스택을 구현한 다음, 입력으로 주어지는 명령을 처리하는 프로그램을 작성하시오. 명령은 총 다섯 가지이다. push X: 정수 X를 스택에 넣는 연산이다. pop: 스택에서 가장 위에 있는 정수를 빼고, 그 수를 출력한다. 만약 스택에 들어있는 정수가 없는 경우에는 -1을 출력한다. size: 스택에 들어있는 정수의 개수를 출력한다. empty: 스택이 비어있으면 1, 아니면 0을 출력한다. top: 스택의 가..

문제 과거 이집트인들은 각 변들의 길이가 3, 4, 5인 삼각형이 직각 삼각형인것을 알아냈다. 주어진 세변의 길이로 삼각형이 직각인지 아닌지 구분하시오. 입력 입력은 여러개의 테스트케이스로 주어지며 마지막줄에는 0 0 0이 입력된다. 각 테스트케이스는 모두 30,000보다 작은 양의 정수로 주어지며, 각 입력은 변의 길이를 의미한다. 출력 각 입력에 대해 직각 삼각형이 맞다면 "right", 아니라면 "wrong"을 출력한다. 문제 풀이 직각삼각형 결성조건인 a^2 + b^2 = c^2를 이용하여 풀이하였다. 제출 코드 import java.util.Arrays; import java.util.Scanner; public class Main { public static void main(String[] ..

이 문제는 N개의 카드 중 3개의 카드를 뽑는 조합으로 이해하고 풀이하였다. 순열 / 조합을 구하는 가장 빠르고 효율적인 방식은 Next Permutation이므로 이를 활용해서 풀었다. 사실, 시간이나 메모리가 넉넉해서 3중 for나 재귀를 이용해 쉽게 해도 풀 수 있지만, 아직 Next Permutaion이 익숙하지 않아서 연습할 겸 풀었다. 제출 코드 import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.util.Arrays; import java.util.StringTokenizer; public class Main { static int N, target; pub..