전체 글 136

[C++] 프로그래머스 - 공원 산책

https://school.programmers.co.kr/learn/courses/30/lessons/172928 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [소스 코드] // 23.06.12 // https://sirius7.tistory.com/ #include #include using namespace std; vector solution(vector park, vector routes) { vector answer; for(int i=0;i

[C++] 프로그래머스 - 달리기 경주

https://school.programmers.co.kr/learn/courses/30/lessons/178871 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr map에 대한 학습 없이 풀었다가 시간 초과가 나왔던 문제입니다. 아래는 시간초과가 나온 코드입니다. #include #include #include using namespace std; vector solution(vector players, vector callings) { vector answer(players); for(int i=0;i

[C에서 C++로 넘어가기] - 8. map, unordered_map

C++에서 사용가능한 컨테이너인 map에 대해서 소개하겠습니다. 컨테이너가 무엇인지에 대해서는 아래 게시글에 설명이 있으니 참고해 주세요 https://sirius7.tistory.com/91 [C에서 C++로 넘어가기] - 6. vector C++에서는 C언어 보다 배열을 더 편하게 다룰 수 있는 방법이 존재합니다. 메모리 할당 등 여러 측면에서 편하게 사용할 수 있는 vector에 대해 알아보겠습니다. vector란? vector는 시퀀스 컨테이너로, sirius7.tistory.com map이란? map은 #include 헤더를 선언한 후 사용 가능하며, 쌍으로 이루어진 자료구조의 하나입니다. map의 특징을 정리하면 다음과 같습니다. key를 first로, value를 second로 저장 key ..

[C++] 프로그래머스 - 성격 유형 검사하기

https://school.programmers.co.kr/learn/courses/30/lessons/118666 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr [소스코드] #include #include using namespace std; string solution(vector survey, vector choices) { string answer = ""; char typeName[8]={'R','T','C','F','J','M','A','N'}; int typeScore[8]={0}; for(int i=0;i= typeScore['N'] ? '..

React, Node.js와 MySQL을 이용한 로그인/회원가입 예제 (소스코드)

설명 express를 비롯한 Node.js의 모듈들과, React로 구현한 로그인, 회원가입 예제입니다. React를 사용하지 않고 구현한 예제는 아래와 같습니다. https://sirius7.tistory.com/59 Node.js와 MySQL을 이용한 로그인/회원가입 예제 (소스코드) 설명 express를 비롯한 Node.js의 모듈들과, 5개 정도의 js파일로 구현한 로그인, 회원가입 예제입니다. MySQL을 데이터베이스로 사용하였기 때문에 MySQL을 설치하셔야 사용 가능합니다. (사용방법 링 sirius7.tistory.com MySQL을 데이터베이스로 사용하였기 때문에 MySQL을 설치하셔야 사용 가능합니다. (사용방법 링크) 사용하시면서 궁금하신 점이나 문제점이 있다면 댓글 달아주세요. 필요..

[React] 5. fetch 함수

fetch() 함수란? fetch 함수는 JavaScript에서 제공하는 API 중 하나로, 서버에서 데이터를 가져오기 위해 사용됩니다. fetch 함수는 네트워크 요청을 보내고, 서버로부터 응답을 받습니다. 응답은 promise 객체로 반환되며, 이를 통해 비동기적으로 데이터를 처리할 수 있습니다. ChatGPT에 물어봤을때 나온 답변인데, 다른곳에서 찾아본 내용과 비교했을 때 큰 차이가 없어 가져와 봤다. 위의 설명대로, fetch API는 백엔드 서버와 데이터를 주고받는데 사용한다. 간단하게 설명하자면 React에서는 Node.js 등과 데이터를 주고받기 위해 fetch 함수를 사용한다. 자세한 내용은 다음 링크들에 정리되어 있다. https://developer.mozilla.org/ko/docs..

WEB/⚛️ React 2023.02.22

[React] 4. CRUD 게시판 구현하기

생활코딩 React 2022년 개정판 강의(https://opentutorials.org/course/4900)를 듣고 개인 학습용으로 정리한 게시글입니다. React를 이용하여 CRUD( Create, Read, Update, Delete )기능을 구현한 게시판이다. 예전에 Node.js로 같은 기능을 구현한 적이 있는데, React로 구현하니 더 깔끔한것 같다. Node.js로 구현했던 CRUD 게시판은 아래 링크를 참고. https://sirius7.tistory.com/48 [Node.js] 8. CRUD 게시판 구현 CRUD CRUD란 Create(생성), Read(읽기), Update(갱신), Delete(삭제) 의 약자로, 사용자 인터페이스가 갖추어야 할 기능을 말한다. Node.js로 CR..

WEB/⚛️ React 2023.02.16

[React] 3. state

생활코딩 React 2022년 개정판 강의(https://opentutorials.org/course/4900)를 듣고 개인 학습용으로 정리한 게시글입니다. 1. State의 정의 state란? prop 과 함께 컴포넌트 함수를 다시 실행해서 새로운 리턴값을 만들어 준다. prop과 state 모두 이 값이 변경되면 새로운 리턴 값을 만들어서 ui를 바꾼다. state는 값이 변경되면 HTML이 자동으로 다시 랜더링 된다. (= 새로고침 하지 않아도 됨) 일반 변수는 값이 변경되어도 HTML이 자동으로 다시 랜더링 되지 X (= 새로고침 해야함) 변수 외에 데이터를 저장하는 또 다른 옵션으로 생각해도 됨 문자, 숫자, object, array 등을 저장 가능하다. useState()를 이용해서 만들어야 ..

WEB/⚛️ React 2023.02.11

[React] 2. 컴포넌트, props, event

생활코딩 React 2022년 개정판 강의(https://opentutorials.org/course/4900)를 듣고 개인 학습용으로 정리한 게시글입니다. 1. 컴포넌트 소스코드 정리정돈의 핵심 : 서로 연관된 것을 모은 다음(그룹핑) 이름을 붙인다. 리액트는 사용자 정의 태그를 만드는 기술이므로, 사용자 정의 태그를 이용해 연관된것을 모아 정리 정돈한다. 사용자 정의 태그 만들기 사용자 정의태그를 만들때는 함수를 정의한다. 사용자 정의태그를 만들때는 반드시 대문자로 시작해야 한다. 리액트에서는 사용자 정의태그를 컴포넌트(component)라고 부른다. 컴포넌트를 사용할 때의 장점 각 코드가 이름을 가지고 있기 때문에 어떤 취지의 코드인지 금방 파악 가능하다. 한번의 수정으로 컴포넌트를 사용하는 모든 ..

WEB/⚛️ React 2023.02.10

[React] 1. 시작하기 (리액트 소개, 설치, 수정, 배포)

생활코딩 React 2022년 개정판 강의(https://opentutorials.org/course/4900)를 듣고 개인 학습용으로 정리한 게시글입니다. 1. 리액트 소개 메타에서 개발한 오픈 소스 자바스크립트 라이브러리 SPA (Single Page Application)을 전제로 한다 웹 앱을 만드는 라이브러리 React, Angular, Vue 중 가장 사용자가 많다. 리액트의 핵심적인 역할 : 사용자 정의 태그를 만드는 것 사용자 정의 태그 부품으로 사용된다 남들에게 공유할 수 있고, 남들의 부품을 사용할 수 있음 거대한 리액트 부품 공유망으로 들어가는 것은 큰 가능성을 열어준다 리액트를 만드는 2가지 방법 클래스(class) 문법 사용 → 이전 강의 참고 함수(function) 문법 사용 :..

WEB/⚛️ React 2023.02.07