목록전체 글 (259)
차근차근
0. 제목 백준 2331 반복수열 BOJ 2331 반복수열 C++ 2331 반복수열 1. 문제 https://www.acmicpc.net/problem/2331 2. 풀이 DFS를 사용하였다. visited는 방문횟수를 저장하는 배열이다. 인덱스의 최댓값은 300000을 넘지 못하므로 visited[300001] 으로 크기를 설정하였다. dfs함수를 구현할 때 방문할때마다 visited[x]의 값을 1씩 증가시켜주었다. 그리고 if(visited[x]==3) retun; 에서 3일때 return 해야 하는 이유는 문제에서 반복되는 부분을 제외했을 때, 수열에 남게 되는 수들의 개수를 구하라고 하였기 때문이다. 만약 2에서 return을 해버리면 반복되는 수들까지 개수에 포함이 된다. 그래서 3일때 ret..
0. State 소개 state라는 개념은 props와 비교해가면서 봐야한다. 어떤 제품에 있어서 사용자의 입장이 있고 구현자의 입장이 있을 것이다. props는 사용자가 장치를 조작하는 장치(핸드폰의 전원 버튼 등)이고 state는 제품을 만드는 구현자들은 내부적 조작장치(내부 칩, 회로 등)이다. 정리해보면 props는 사용자가 컴포넌트를 사용하는 입장에서 중요한 것이고 state는 그 props의 값에 따라서 내부 구현에 필요한 데이터들이 state이다. 컴포넌트를 만들었을 때 컴포넌트의 기능을 조작하는 것이 props이다. 컴포넌트의 사용자에게 중요함. 사용자들에겐 알 필요도 없고 알아서도 안되는 컴포넌트 내부적으로 사용되는 것들이 State이다. 1. State 사용 App.js에서 코드를 작성..
0. Library vs Framework Libray는 기능을 제공하는 모음이라고 하면 그 모음에 규칙을 넣은 것이 Framework이다. 아래 그림을 보면, 명시적 렌더링에서 하는 역할이 DOM Listener, Data binding 이다. 명시적 렌더링, 컴포넌트까지가 Library이다. Framework 기능을 할 때는 라우터라고 해서 화면을 이동하는 기술이 쓰이고, 상태관리 기능도 쓰인다. 정리해보면, Vue.js는 작은 화면단 라이브러리 역할부터 큰 규모의 웹 애플리케이션 개발을 돕는 프레임워크 역할까지 점진적으로 적용할 수 있는 프런트엔드 프레임워크이다. Vue.js Library 라인업을 보면 다음과 같다. Vue.js 코어, Vue Router, Vuew, Vue CLI, Vue Dev..
0. JavaScript/HTML JavaScript/HTML 방식을 보기 위해 vue > old.html 파일을 만든 후 코드를 작성하였다. str을 바꿀때마다 div.innerHTML = str; 을 써줘야 했다. 참고로 JavaScript의 기능에 대해서 구글링 할 때는 검색어 뒤에 MDN(Mozilla Developer Network)을 붙여주자. 공식문서이기 때문에 보다 정확한 정보를 얻을 수 있다. Obj를 추가하여 코드를 조금 더 작성해보고 결과를 확인해보았다. Reactivity의 특성을 볼 수 있다. event 로 JavaScript예시를 들어보자. 1. Vue Vue의 특성을 보기위해 vue > vue.html 파일을 만든 후 코드를 작성하였다. 2. 비교 참고로 Vue는 JavaScr..
0. 문제 📌VSCode 에서 Extensions 에서도 적절한 것을 모두 설치했지만 태그 자동완성이 안됨. 📌 ! 입력후 Tab키를 누르면 자동으로 코드가 나와야 하는데 작동하지 않음. 1. 해결 빨간 동그라미 부분이 Django HTML로 설정되어 있음. HTML로 바꿔줌. 정상 작동! 해결 완료~
0. 백엔드란? 백엔드는 화면에서 볼수 없지만 웹이나 앱에서 사용자의 요청에 따라 정보를 처리하고 가공하는 부분이다. 백엔드를 바닥부터 개발하기에는 구조가 조금 복잡하여 이미 많은 것이 갖추어진 어떤 틀 안에서 작업하게 되는데 그 틀을 '프레임워크'라고 부른다. 어떤 구조로 만들었는지, 어떤 언어를 사용하는지 등에 따라 정말 다양한 프레임워크가 있고 각자의 장단점이 있다. 백엔드는 크게 세부분으로 나눌 수 있다. 데이터를 담당하는 모델(Model) 화면을 담당하는 뷰(View) 전반적인 관리를 담당하는 컨트롤러(Controller) 이 것을 "MVC 패턴"이라고 부른다. 홈페이지 게시판에 들어가는 예시를 들어보자. http://sangwon.com/board 라는 라우터(Router)에서는 "board"..
0. 네이티브 앱 만들기 네이티브 앱이란 Android 와 iOS 환경에 맞춰서 각각에 특화하여 개발하는 것 Android 앱을 만들기 위해서는 Java 혹은 Kotlin을 이용하여 Android Studio를 이용해서 만들 수 있다. iOS 앱을 만들기 위해서는 Objective-C 혹은 Swift를 이용하여 Xcode를 이용해서 만들 수 있다. 네이티브 앱은 각각의 OS에 맞춰서 만드는 것이라 성능은 가장 뛰어나지만 내가 만든 앱을 각각의 스토어에 출시하려면 각각의 언어와 플랫폼에 대해 학습해야하는 부담이 있다. 1. 하이브리드 앱 만들기 하이브리드 앱은 하나의 언어로 각각의 플랫폼(OS)에 맞는 앱을 동시에 개발하는 것이다. 대표적으로 React-Native라는 프레임워크를 이용하면 JavaScri..
0. 방법 내 컴퓨터를 서버로 만드는 방법 -> 보안에 취약하고, 365일 24시간 가동해야 하기 때문에 추천하지 않음 외부 서버를 이용하는 방법 -> 웹호스팅 제공 업체 amazon, netlify 등을 이용 1. netlify 이용방법 원하는 폴더 올린 후 이름바꾸고 싶다면 다시 설정 해주면 끝 https://www.netlify.com/ Netlify: All-in-one platform for automating modern web projects Deploy modern static websites with Netlify. Get CDN, Continuous deployment, 1-click HTTPS, and all the services you need. Get started for fre..
0. 제목 백준 11047 동전 0 BOJ 11047 동전 0 C++ 11047 동전 0 1. 문제 https://www.acmicpc.net/problem/11047 2. 풀이 그리디 알고리즘을 사용하였다. 그리디 알고리즘(욕심쟁이 알고리즘, Greedy Algorithm)이란 "매 선택에서 지금 이 순간 당장 최적인 답을 선택하여 적합한 결과를 도출하자"라는 모토를 가지는 알고리즘 설계 기법이다. 동전의 가치가 오름차순으로 주어지기 때문에 가치가 큰 동전부터 차례대로 나눈다. 몫만큼 cnt에 더해주고 K를 나머지로 갱신해준다. 그렇게 모든 동전에 대해서 K/value[i]의 값이 0이 아닌동안 반복하면 누적된 cnt가 정답이다. 3. 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 1..
0. 2020년 프런트엔드 개발 현황 HTML, CSS, JS -> ES6, NPM, WebPack, TypeScript 화면 개발 방식 과거 : HTML, CSS, JS 현재 : npm(패키지 관리 도구), ES6(최신 자바스크립트 문법), WebPack(모듈 번들러), TypeScript(타입에 엄격한 자바스크립트) 예를 들어 최근에 페이스북, 에어비엔비같은 사이트들은 자바스크립트 양이 매우 많다. 그래서 위와 같은 도구들로 관리하는 것이 필요하게 되었다. 1. Vue.js가 주목 받는 이유 Vue.js는 JavaScript의 프레임워크이다. 구글 트렌드, 깃헙에서 검색량 1위 'Vue.js' 기존 기술 스택과 함께 사용하기 쉽다.(jQuery 사이에 껴넣는 것이 가능하다.) 공식문서가 아주 잘 되어..