전체 글 161

[포스코x코딩온] 웹개발자 입문 과정 3주차 회고-03 | JQuery

1.jQuery란: : 자바스크립트 언어를 간편하게 사용할 수 있도록 단순화시킨 오픈소스 기반의 자바스크립트 라이브러리이다. - 사용 방법: $(선택자).동작함수(); 처음엔 jQuery가 많이 사용 되었으나 jQuery를 대체할 react 나 view 같은 가상 dom을 다루는 라이브러리들이 많이 생겼으며, 기본 자바스크립트도 많이 기능들이 생기기도 했고 jQuery가 무거워서 잘 안쓰이는 추세이다. 2.사용 방법 https://releases.jquery.com/ 에서 당연한 말이지만 이 과정이 없으면 적용이 안된다. 3.메소드 1) 값 가져오기 & 설정하기: - $(선택자).val(); ex. var value =$('input').val(); - $(선택자).val('설정할 값'); ex. var..

[포스코x코딩온] 웹개발자 입문 과정 3주차 회고-02 | JavaScript addEventListener

1. addEventListener란? DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다. * 사용방법: 요소.addEventListener(이벤트, 명령) 선택 요소에 지정한 이벤트가 발생하면, 약속된 명령어를 실행 2. addEventListener 이벤트의 종류 1) Click 클릭 2) Mouse 계열 - Mouseover: 요소에 커서를 올렸을 때 - Mouseout: 마우스가 요소를 벗어날 떄 - Mousedown: 마우스 버튼을 누르고 있는 상태 - Mouseup: 마우스 버튼을 떼는 순간 3) Focus: 포커스가 갔을 떄 4) Blur: 포커스가 벗어나는 순간 5) Key 계열 - Keypress: 키를 누르는 순간 + 누르고 있는 동안 계속 발..

백준- 단계별로 풀어보기| 3단계- 반복문

단계 문제번호 제목 코드 1 2739 구구단 num = int(input()) for i in range(9): print(num,'*',i+1,'=',num*(i+1)) 구구단을 출력하는 문제 2 10950 A+B - 3 test_case = int(input()) for i in range(test_case): num1, num2 = map(int, input().split()) print(num1+num2) A+B를 여러 번 출력하는 문제 3 8393 합 n = int(input()) sum = 0 for i in range(n): i += 1 sum+=i print(sum) 1부터 N까지의 합을 구하는 문제. 물론 반복문 없이 풀 수도 있습니다. 4 25304 영수증 total = int(inpu..

[포스코x코딩온] 웹개발자 입문 과정 3주차 회고-01 | JavaScript DOM

1. DOM이란? 문서 객체 모델(DOM, Document Object Model)은 XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스 * 인터페이스란? 서로 다른 두 개의 시스템, 장치 사이에서 정보나 신호를 주고받는 경우의 접점이나 경계면 * : 태그의 defer 속성은 페이지가 모두 로드된 후에 해당 외부 스크립트가 실행됨을 명시합니다. 2. DOM을 통한 요소 선택 - 요소 선택자를 사용해서 가져옴 1) document.querySelector('요소 선택자') - 태그 중 맨 처음 요소를 가져옴 console.log(document.querySelector(".others")); console.log(document.querySelector("#green")); console.log(d..

프로그래머스, 백준 깃허브 연동하기 및 빨간 체크박스 문제

1. 먼저 크롬 웹스토어에서 '백준 허브'를 검색해서 다운 받는다. 2. 다운 받은 이후 상단 확장 프로그램에서 백준 허브를 클릭한다. 3. 이후 절차에 따라 새로운 레퍼지토리를 설정하거나 기존 레퍼지토리를 연동시키면 되는데 , 왜인지 모르겠으나 기존 레포지토리에 연동이 안된 적이 있어서 새로운 레퍼지토리에 연동해주는게 좋을 듯하다. 4. 만약에 백준 문제를 풀고 제출했을 때 빨간 체크 박스가 뜨는 경우가 있다. 이 경우 깃허브에 연동이 되지 않았다는 것을 의미한다. 이럴 때는 확장 프로그램에서 'CORS'를 검색해서 맨 위 프로그램을 다운 받고 이후 상단에서 선택한다음 'on'으로 바꿔준다. 이후에는 잘 업로드 되는 것을 확인할 수 있다.

코딩테스트 2023.03.11

[포스코x코딩온] 웹개발자 입문 과정 2주차 회고-10 | CSS 반응형

1. 반응형 vs 적응형 - 반응형이란? 디스플레이 종류에 따라 화면의 크기가 자동으로 최적화되는 웹페이지이다. - 적응형이란? pc용 사이트와 모바일용 사이트를 별도로 제공하는 방식을 말한다. 2. 반응형 웹을 위한 CSS의 Media query - Media query란? 반응형 레이아웃을 구성하게 해주는 CSS문법이다. - 사용 방법 @media and (미디어 조건) {} (1) 미디어 유형 : all(모든 미디어 장치), screen(화면을 출력하는 디스플레이가 있는 기기), print(인쇄 화면) (2) 미디어 조건 : A.width : 뷰포트 너비 - min-width/ max-width B.height: 뷰포트 높이 - min-height/ max-height C.orientation: 가..

프론트앤드/CSS 2023.03.11

[포스코x코딩온] 웹개발자 입문 과정 2주차 회고-09 | JavaScript 메소드

1. Javascript 내장 메소드를 알아보자 ~! 1) 문자열관련 메소드 -> 기존 str 안바뀜 - length - 문자열 길이를 반환(공백 포함)// 속성이라 () 안씀 - toUpperCase()&toLowerCase() - 문자열 전제 대문자, 소문자 변경 - indexOf{''} - 문자열을 받아서 몇번째 인덱스인지 반환 - slice(startrldx,endldx)-시작~끝까지 슬라이싱, 음수값도 가능함 - replace(str1,str2) - 처음만 찾아서 변경 - replaceAll(str1,str2) - 모두 찾아서 변경 - repeat(n) - n번 반복 - trim() - 양끝 공백 없앰 - split() - 문자열을 배열로 바꿔주는 함수인데 '기준' 이 필요 if ''-> 전체 ..

[포스코x코딩온] 웹개발자 입문 과정 2주차 회고-08 | JavaScript 반복문

1. 반복문이란? : 특정 조건을 만족할 때 같은 동작을 반복하여 수행하도록 만든 제어하는 명령문이다. 2. 반복문의 종류 1) for문 for (초기화식; 조건식; 증감식) { 실행문장;} 2) while문 - for문과 달리 조건을 변경하는 구문이 기본적으로 포함되어 있지 않기때문에 무한루프가 가능하다. - 무한 루프에 걸리지 않도록 주의하여 사용이 필요하다 while (조건문) {실행할 코드(명령문);} //1. 조건문을 사용하는 방법 let num = 0; while (num < 10) { console.log(`$(num+1)번째`); num++; } //2. if + break사용 let num2 = 0; while(true) { conole.log(`${num2+1}번째`); num2++ i..