공부하자

https://developers.kakao.com/ Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 카카오에서는 다양한 API들을 제공한다 내가 구현할 것은 JS+리액트로 카카오톡 공유하기 기능을 구현하기! 1. 로그인 후 내 애플리케이션을 등록해준다 2. 플랫폼에는 사이트 도메인을 넣어줌, 배포 전 테스트일 때는 localhost 링크 넣어주기! 3. 구현 방법을 선택한다 API 메소드 - 공유하기 버튼도 만들 것인지 - 내가 만들어둔 버튼에 onclick만 써서 바로 보낼것인지! 메시지 구성 방법 - 기본 메시지 (카카오톡에서 템플릿 제공해..

블로그는 보는 눈이 너무 많아져서 여기에라도 뭔가를 적어야 마음이 풀릴 것 같아서... 내 마음의 상태가 현재 어떠한가? - 답답하고 힘들다 그 마음의 원인은 무엇인가? - 진로에 대한 고민인 것 같다 다른 추가적인 원인은 없는가? - 저것만 빼면 딱히 없는 것 같다 그렇다면 해결책을 제시해보자 진로에 대한 고민이 자세하게 무엇이 있는가? - 1. 공부를 하곤 있는데 이 방법이 맞는 건지 모르겠다 더 나은 효율적인 방법이 있는데 내가 돌아가는 방식으로 공부를 하는건 아닐지 걱정이 된다 난 공백기 없이 바로 취업을 해야하는데 그래서 시간이 중요한데 아직 공부를 해도 계속 초급~중급 단계에 계속 머무르고 있는 것 같다 2. 진로 방향에 대한 고민이다 프론트에 대한 고민이라고 할 수 있는데 프론트는 오래 못 ..

https://www.acmicpc.net/problem/20055 20055번: 컨베이어 벨트 위의 로봇 길이가 N인 컨베이어 벨트가 있고, 길이가 2N인 벨트가 이 컨베이어 벨트를 위아래로 감싸며 돌고 있다. 벨트는 길이 1 간격으로 2N개의 칸으로 나뉘어져 있으며, 각 칸에는 아래 그림과 같이 1부 www.acmicpc.net 문제 정리 하 머야 생각 벨트를 두 개를 만들어서 관리하는데 배열을 따로 쓸지 2차원 배열을 쓸지 고민이다 로봇 유무는 bool로 확인, 먼저 올라간 로봇 먼저 움직인다 -> 큐를 사용? 뭐가 일케 많음 하 넘 생각할 게 많아 코드 #include using namespace std; int main() { int N, K; cin >> N >> K; int durabilit..

https://www.acmicpc.net/problem/1965 1965번: 상자넣기 정육면체 모양의 상자가 일렬로 늘어서 있다. 상자마다 크기가 주어져 있는데, 앞에 있는 상자의 크기가 뒤에 있는 상자의 크기보다 작으면, 앞에 있는 상자를 뒤에 있는 상자 안에 넣을 수가 www.acmicpc.net 문제 정리 주어진 상자들의 크기를 고려하여 각 상자 안에 다른 상자를 넣을 수 있는 최대 개수! 자르긴가 생각 각 상자를 마지막으로 포함하는 최대 상자 개수를 저장하는 배열 만들기 -> 저번에 했던 dp랑 비슷한데? 똑같은 형식인듯!! 코드 #include #include using namespace std; int main() { int n; cin >> n; int box[n]; int dp[n]; f..

https://www.acmicpc.net/problem/2631 2631번: 줄세우기 KOI 어린이집에는 N명의 아이들이 있다. 오늘은 소풍을 가는 날이다. 선생님은 1번부터 N번까지 번호가 적혀있는 번호표를 아이들의 가슴에 붙여주었다. 선생님은 아이들을 효과적으로 보호하기 www.acmicpc.net 문제 정리 주어진 아이들의 키를 가장 적게 움직여서 증가수열이 되도록 정렬하는 문제 문제가 왤케 쓸데없이 길어;;; 난독 오게 생ㄱ김 생각 DP로 푸는데 아이의 위치를 변경할 때마다 그 때까지의 최대 증가수열의 길이를 저장 코드 #include #include using namespace std; int main() { int N; cin >> N; int children[N]; int dp[N]; fo..

절대경로를 설정하는 이유 import main from '../../Images/main/main.svg' 이런 식으로 ../을 무한 생성하게 되니까 여러 개 import할 땐 지저분하게 보일 수 있음! 절대경로를 설정해주면 import main from 'Images/main/main.svg' 이렇게 코드를 간단하게 줄일 수 있다! CRA(create-react-app)에서 절대경로 설정하는 방법 1. 최상위 루트에 jsconfig.json파일을 만든다 있는 경우에는 파일 내용을 추가해주면 됨 2. 아래 내용을 추가해준다 { "compilerOptions": { "baseUrl": "src" }, "include": ["src"], "exclude": ["node_modules"] } 3. 서버를 재실..

mkdir test2 - 파일 생성 git init - 깃 초기화 git remote add origin https://github.com/chaegimjeong/solfa.git - 원격 저장소에 연결! git branch -M main - 메인 브런치 생성 git push -u origin main - 생성한 메인 브런치를 origin에 푸시 git remote -v - ? origin https://github.com/chaegimjeong/solfa.git (fetch) origin https://github.com/chaegimjeong/solfa.git (push) vi README.MD - 수정 git add . - 수정 후 add git status - status로 상태 확인 git co..

onClick이랑 onSubmit 차이점이 무엇일까? 난 그동안 모든 이벤트를 onClick으로 처리했는데 두 이벤트 프로퍼티의 차이점을 비교해보고자 한다! onClick이란? - 용도 : 주로 버튼이나 다른 클릭 가능한 엘리먼트에 대한 클릭 이벤트를 처리하기 위해 사용된다. - 이벤트 타입 : 마우스 클릭 이벤트에 반응한다. - 사용법 function handleClick() { // 클릭 이벤트 처리 로직 } Click me 주의사항 : 요소뿐만 아니라 다른 클릭 가능한 엘리먼트에도 사용할 수 있다. onSubmit이란? - 용도 : 주로 폼(form) 엘리먼트에서 전송(submit) 이벤트를 처리하기 위해 사용된다. - 이벤트 타입 : 폼이 제출될 때 발생하는 이벤트에 반응한다. - 사용법 func..

console.log를 찍었는데 이렇게 두 번씩 찍히고 출력되는 경우가 생길 수 있다... 이런 경우 index.js에서 을 감싸고 있는 를 빼준다! import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( // // ); reportWebVitals(); 이 후 콘솔을 찍어보면 정상 출력되는 것을 확인할 수 있다! 그렇다면 왜 그..

아래 책을 읽고 정리한 내용입니다. https://m.yes24.com/Goods/Detail/87631428 Do it! 리액트 프로그래밍 정석 - 예스24 실리콘밸리 리액트 클래스를 그대로 담았다!에어비앤비 프런트엔드 리드에게 배우는 리액트 프로그래밍!전 세계의 뛰어난 개발자들이 모여 일한다는 실리콘밸리! 실리콘밸리에서도 핫한 기업 m.yes24.com 배열 함수 ES6의 forEach()함수 사용 방법 알아보기 ⇒ 문자열(쿼리 스트링 = 웹 주소에 포함시키는 문자열)을 분리 후 비교! const qs = 'banana=10&apple=20&orange=30'; function parse(qs) { var queryString = qs.substr(1); // querystring = 'banana=..