코딩을 배우는 직장인

이 두가지를 console에 담아서 log 하면 현재 파일경로(__filename) 현재 파일이 있는 폴더 경로(__dirname) 이 나온다 이런 식으로

아래 내용은 스타트 위드 유데미에서 제공해준 한입크기로 잘라먹는 react 강의에서 배운 내용을 토대로 작성한 것입니다. https://www.udemy.com/course/winterlood-react-basic/ 이미지 썸네일 삭제 한입 크기로 잘라 먹는 리액트(React.js) [2022 최신 React 강의] 실전 프로젝트 감정일기를 만들며 배우는 리액트(React) www.udemy.com 안녕하세요 이번엔 JavaScript의 특성 단락회로 평가에대해 알아볼려고 합니다. Js는 논리 연산자가 여러가지가 있는데요 그중에 비교연산자 && 와 || 를 알아보겠습니다. const name = true && true const name2 = true && false const name3 = true |..

안녕하세요. 오늘은 classList 에 대해 알아보겠습니다. 일단 예시 코드를 하나 만들어볼께요 # html Hello! ---------------------------------------------------------------------------------- #css .text { font-size: 16px; color: blue; } .text2 { color: red; } ----------------------------------------------------------------------------------- #Js const textA = document.querySelector(".text") //textA 변수에 text라는 클래스를 가진 p태그를 찾아서 담습니다. fu..

1. Math 객체의 프로퍼티는 항상 정해진 값을 가지고 있다. 아래 표와 같다. E 오일러 상수 PI 원주율 (약 3.14.....) SQRT2 √2 SQRT1_2 1/√2 2. Math 객체의 메서드 abs() 절댓값 반환 acos() 아크 코사인 값을 반환 asin() 아크 사인 값을 반환 atan() 아크 탄젠트 값을 반환 ceil() 매개변수의 소수점 이하부분을 올립니다. cos() 코사인 값을 반환 exp() 지수 함수를 나타냅니다. floor() 매개변수의 소수점 이하부분을 버립니다. log() 매개변수에 대한 로그값을 반환합니다. max() 매개변수 중 최댓값을 반환합니다. min() 매개변수중 최솟값을 반환합니다. pow() 매개변수의 지숫값을 반환합니다. random() 0과 1사이의 ..

구분 설명 프로퍼티 altKey 이벤트가 발생할때 ALT를 눌렀는지 여부를 boolean 값으로 반환 합니다. button 마우스에서 누른 버튼의 키값을 반환합니다. charCode keypress 이벤트가 발생할 때 어떤 키를 눌렀는지 유니코드 값으로 반환 합니다. clientX 이벤트가 발생한 가로 위치 반환 clientY 이벤트가 발생한 세로 위치 반환 ctrlKey 이벤트가 발생할 때 Ctrl를 눌렀는지 여부를 boolean 값으로 반환합니다. pageX 현재 문서 기준으로 이벤트가 발생한 가로 위치를 반환 pageY 현재 문서 기준으로 이벤트가 발생한 세로위치 반환 screenX 현재 화면 기준으로 이벤트가 발생한 가로길이 반환 screenY 현재 화면 기준으로 이벤트가 발생한 세로길이 반환 s..

일단 변수 선언을 먼저 한뒤 변수에 메서드를 사용 var now = new Date(); 이런식으로 메서드 사용할때는 now.getTime() 아래 표는 메서드 종류이다. 구분 설명 날짜 . 시간 정보 가져오기 getFullYear() 연도를 4자리 숫자로 표시합니다. getMonth() 0~11 사이의 숫자로 월을 표시합니다. 0부터 1월이 시작되고 11은 12월입니다. getDate() 1~31 사이의 숫자로 일을 표시합니다. getDay() 0~6사이의 숫자로 요일을 표시합니다. 0부터 일요일이 시작되고 6은 토요일입니다. getTime() 1970년 1월 1일 자정 이후의 시간을 밀리 초(1/1000초)로 표시합니다. getHours() 0~23 사이의 숫자로 시를 표시합니다. getMinutes..

종류 설명 concat 기존 배열에 요소를 추가해 새로운 배열을 만듭니다. every 배열의 모든 요소가 주어진 함수에 대해 참이면 true를 반환하고 그렇지 않으면 false를 반환 합니다. filter 배열 요소 중에서 주어진 필터링 함수에 대해 true인 요소만 골라 새로운 배열을 만듭니다. forEach 배열의 모든 요소에 대해 주어진 함수를 실행합니다. indexOf 주어진 값과 일치하는 값이 있는 배열요소의 첫 인덱스를 찾습니다. join 배열요소를 문자열로 합칩니다. 이때 구분자를 지정할 수 있습니다. push 배열의 맨 끝에 새로운 요소를 추가한 후 새로운 length를 반환합니다. unshift 배열의 시작 부분에 새로운 요소를 추가합니다. pop 배열의 마지막 요소를 꺼내 그 값을 결과..

1. 마우스 이벤트 click 클릭할 때 이벤트 발생 dblclick 더블클릭할 때 이벤트 발생 mousedown 사용자가 요소 위에서 마우스 버튼을 눌렀을 때 이벤트 발생 mousemove 사용자가 요소 위에서 마우소 포인터를 움직일 때 이벤트 발생 mouseover 마우스포인터가 요소 위에 있을 때 이벤트 발생 mouseout 마우스 포인터가 요소를 벗어날 때 이벤트 발생 mouseup 사용자가 요소 위에 놓인 마우스 버튼에서 손을 뗄 때 이벤트 발생 2. 키보드 이벤트 keydown 사용자가 키를 누르는 동안 이벤트 발생 keypress 사용자가 키를 눌렀을 때 이벤트 발생 keyup 사용자가 키에서 손을 뗄 때 이벤트 발생 3. 문서 로딩 이벤트 abort 문서가 완전히 로딩되기전에 불러오기를 멈..

안녕하세요! 오늘은 audio tag를 넣어서 웹페이지를 만드는 도중 background-color를 투명하게 만들려고 해도 되지 않아 구글링을 해서 알게 된 사실을 알려드릴려고 합니다. 결론은 불가능 하다입니다. 그럼 저희는 당연히 이런걸 바꾸기 위해서 javascript가 있는 것이고 어떻게 하면 바꿀 수 있을지 볼까요? 일단 간단히 codesandbox에서 해보도록 하겠습니다. 일단 이렇게 style에 background color로 transparent를 줘도 투명해지지 않습니다. 인터넷에서 찾아보니, audio::-webkit-media-controls-play-button, audio::-webkit-media-controls-panel { background-color: transparent..

일단 설치 npm i -D tailwindcss postcss autoprefixer 그리고 테일윈드 시작 npx tailwindcss init -p 그러면 2가지 파일이 만들어지는데 postcss랑 tailwind.config 이다 여기서 postcss는 건드릴 것이 딱히 없고 고수는 있겠지만 나같은 초짜는 없다 config.js를 열어보면 저기 content부분에 원래는 아무것도 없으나 강의를 보면서 따라적었다. 저 의미는 “./” 이 의미는 현재 폴더에서 라는 뜻이다 “./pages/” 이의미는 현재폴더에 pages라는 폴더의 의미이다. “./pages/**/” 이 의미는 현재폴더의 pages폴더 안에 모든 폴더를 얘기한다. “./pages/**/*” 이 의미는 위 의미의 폴더에 모든 파일을 얘기한..