개발새발개발

참고terminal 창에서 warning message 삭제하는 법/*eslint-disable*/ 오늘 할 것 :좋아요버튼과 좋아요 개수 UI 만들기  좋아요 버튼 만들기onClick Eventhandler클릭했을 때 {} 안의 함수가 실행됨사용법onClick={funcName} 후 funciotn 정의onClick={function() {console.log(1)}}onClick={() => {console.log(1)}}{} 안에는 함수가 들어가야 함 좋아요 개수 UI 만들기State 변경state는 등호로 변경 금지(html에 반영 안됨)useState()에서 변수 선언할 때 두번째 파라미터를 이용해 수정해야 함ex) let [like, likeController ] = useState(0)변경하..

코딩애플님의 2022 리액트 강의 2~6강을 참고해서 React로 간단한 홈페이지 만들기를 해보았다! 무료강의가 6강까지만 있어서 완성도 있는 홈페이지는 안나왔지만,React 입문 느낌으로 해보기 좋았다 이 글 이후부터는 "리액트를 다루는 기술" 책을 바탕으로 공부할 계획이다!  JSX 문법기본 셋팅App.js에서 div 하나만 남기고 지우기 JSX 문법class 넣을 땐 className으로 해야함class 선언과 혼동될 수 있기 때문변수 넣을 땐 {중괄호} : 데이터 바인딩태그 사이 뿐만 아니라 태그 안에도 사용 가능(ex)style 넣을 땐 style={{스타일명:'값'}}카멜케이스로 작성(font-size(X), fontSize(O)) 참고error message는 팝업으로 뜨기도 하고, cons..

VS code에서 React를 하려고 할 때, 자동 완성 태그가 안됐다구글에 검색해보니 다행히 나와 같은 고충을 겪는 분들이 많아보였다2가지 방법인데 원리는 같고, 1번째 방법이 안되면 2번째로 해보면 될 것 같다  첫번째 방법  1. 왼쪽 상단 [파일] - [기본설정] - [설정] 또는 `Ctrl +`        2. include Languages 검색 후 [항목추가]항목 : javascript  / 값 : javascriptreact        일반적인 경우 위의 방법으로 추가가 가능하지만,   나의 경우 django를 미리 설정해둔 것 때문에VSCode 자체 설정 오류로 항목추가에서 에러가 발생했다   그래서 직접 settings.json으로 가서 수정하니 잘 됐다! (아래 2번째 방법)   ..

1편, 2편에 이어 코딩애플님 AlertBox 만들기 3편(유튜브로는 6강의 내용)  React가 조금 더 부드럽고 여러가지 기능이 많기 때문에요즘은 jQuery를 잘 사용하지 않는다.  하지만 과거부터 현재까지 jQuery를 사용한 웹 사이트가 많이 남아있기 때문에눈에 익혀둘 겸 가볍게 공부했다!  전체 코드 안녕하세요   jQuery 설치법(CDN 이용) 구글에 jquery CDN 검색해서 3.x 에서 minified 버전 사용- uncompressed : 하나도 압축하지 않은 원본- minified : 공백 제거한 압축본느낌- slim : 몇몇 기능이 빠진 가벼운 버전- slim minified : slim + minified  요소 선택$('CSS셀렉..

지난번에 이어 JavaScript 복습하기!그 중에서 JavaScript 에서 중요한 EventListener 파트에 대해 공부할 예정이다  Alert 2개 만들기 [1] 각각의 함수 만들기- 어려우면 한글로 먼저 따라써보기- p태그를 어떻게 지정해야할지 몰라 헤맸는데, id를 부여해주면 해결되는 문제였다! Alert 박스 닫기 아이디 비밀번호   [2] 파라미터 활용하기- 개인적으로는 글이 길어지면 파라미터도 길어져 가시성은 좀 아쉬움- 상황에 맞게 활용해야 할 듯 Alert 박스 닫기 아이디 비밀번호   [3] addEventListener 사용하기- Ev..

JavaScript는 이미 배워 친숙한 친구이지만최근 Django를 하느라 소홀하게 대한 부분이 있어오랜만에 복습겸 유튜버 코딩애플님의 AlertBox 만들기를 따라해봤다!  난이도는 매우매우 쉬움!그래도 싸피에서 배웠던거랑 다른 부분도 있어서 신기했다 이번글은 코딩애플님이 알려주신 것 + 내 생각을 정리를 적어볼 예정이다시작!   1. HTML 요소 변경하기document.getElementById('???').???='red'- 이 형식을 활용하여 대부분의 HTML 요소를 수정할 수 있음- 다만, 가능한 종류가 많기 때문에 '???' 부분은 구글 검색으로 찾아보면서 해야함- 검색할 때 '$' 표시 있는 건 jQuery 문법으로 javascript와 다른거임  안녕하세요! 올때메로나 ..

React 공부를 위해 호기롭게 시작했으나설치에서부터 난관에 부딪혔다..!  이번 글에서는 React 설치 방법과 에러 발생 시 해결 방법에 대해 작성하겠습니다에러 해결 방법이 궁금하신 분들은 글 하단으로 가시면 됩니다.   React 설치 및 프로젝트 생성 방법 개발 환경 셋팅1. nodejs 검색해서 설치2. vscode 에디터 검색해서 설치3. yarn 설치 (`npm install --global yarn')4. git 설치 프로젝트 생성youtube cordingapple 1. 작업용 폴더 만들기  2. Shift+우클릭 - PowerShell/터미널 열기  3. 터미널 창에 `npx create-react-app 프로젝트명` 입력  4. 만약 허가되지 않은 스크립트 어쩌구 에러가 뜬다면  5...

모듈하나의 파이썬 파일로 묶인 변수와 함수의 모음으로 특정 기능을 함다른 프로그래머가 만든 코드를 생산성을 위해 활용하는 것내장모듈 : 파이썬에 이미 있는 수학 관련 변수와 함수 (ex. math. pi)사용법모듈명. 변수명(함수명)- 점의 왼쪽에서 오른쪽에 있는 이름을 찾아라1. import문 사용import mathprint(math.sqrt(4))2. from 절 사용from math import sqrtprint(sqrt(4))- 일반적인 경우 내가 만든 함수인지, 모듈의 함수인지 혼동될 수 있어 1번 코드가 더 명시적임3.  * 사용from math import * - 모듈 내 모든 요소를 한번에 import 하는 것- 오류가 날 수 있어 주의해야 함주의사항- 모듈에서 함수명/변수명이 같은 경우..

float 소수점 설정하기:.(원하는 자릿수)f  문제>출력값 : 10.5 * 50 = 525.0 a = float(10.5)b = float(50) c = float(a*b)#print(a,"*",b,"=",c)print(f'{a} * {b:.0f} = {c:.1f}')   문자열 슬라이싱 a는 28~35번째 까지의 글자b는 113번째부터 총 5글자c는 66번째부터 68번째를 뒤집은 글자d는 322번째부터 총 4글자를 뒤집은 글자e는 365번째부터 작성된 "study"  a = secret[28:35]                                     #28이상, 35미만b = secret[113:113+5]                              #113번째부터 총 5글자니..

프로그래밍프로그래밍의 핵심 & 목적새 연산을 정의하고 조합해 유용한 작업을 수행하는 것"문제를 해결"하는 강력한 방법git bash 나가는 법 : exit()val1 = 10의 의미 : 어딘가에 저장된 상수 10을 가르키는 값이 저장됨(10으로 가는 길을 저장) 연산자 & 진수&지수연산자 우선순위** → -(음수부호)  →*,/,//,% → +,-ex1) -2 ** 4 = -16              #**(지수)가 더 높기 때문에 2**4 먼저 계산된 뒤 다음 우선순위인 -가 작용함ex2) -(2**4) = -16ex3) (-2)**4 = 16진수 표현2진수 : 0b8진수 : 0o16진수 : 0x10지수 표현314e-2 : 3.14 변수변수 : 값을 저장하기 위한 이름변수 할당 : 표현식을 통해 변수..