728x90

분류 전체보기 139

jQuery : jQuery개념, jQuery cdn적용방법, onclick, 메서드 체인, append

1. jQuery란? ▪ 자바스크립트 라이브러리 ▪ Element를 쉽게 찾고 조작가능 ▪ 뛰어난 호환성 ✓ 거의 모든 웹브라우저에 적용가능 ▪ 하락추세라고는 하나, 2020년 기준 점유율 75% ▪ jQuery 시작은 $ → jQuery객체 생성을 위해 $를 사용한다. 2. CDN (Contents Delivery Network) ▪ 자료를 효율적으로 전달하기 위해 여러 노드를 가진 네트워크에 데이터를 저장하여 제공하는 시스템 ▪ 데이터 저장소를 복사한 복제본이 여러군데에 있는 것 3. jQuery cdn 종류 ▪ uncompressed, minified, slim, slim minified ▪ uncompressed ✓ 코드가 그대로 출력, 개발할 때 편리 ✓ 용량 288kb ▪ slim minifi..

언어/HTML,CSS,JS 2022.06.02

GitHub명령어 정리 (커밋, 푸시 명령어)

GitHub를 처음 접하면, 커밋이 뭔지, 푸시가 뭔지 모르는 것들 투성이다. 작고 소중한 내 소스코드를 온전히 올리기 위해서는 깃허브 하는 법을 공부해야한다. 소개글만 읽었는데도 머리가 복잡해지시는 분들을 위해, 이 글에서는 깃허브에 커밋하고 푸시하는 가장 간단한 방법을 소개한다. ※ 한 번 로컬 Repository와 GitHub 서버를 연결해놓으면, 다음 commit, push는 빠르게 할 수 있다. 1. GitHub 최초 연결시 깃허브에 최초 연결시 사용하는 커밋 명령어, 푸시 명령어와 최초 연결 이후 명령어는 다르다. 최초연결할 때는 로컬 레포지토리와 서버 레포지토리를 연결해주는 작업이 필요하다. 우선, 본인의 PC에서 깃허브와 연동할 폴더를 지정하고 마우스를 우클릭해서 Git Bash Here로..

JavaScript Selector, mouse 관련 이벤트 (onmouseover, onmouseleave)

1. Java Script 셀렉터 종류 ➢요소의 ID명 ▪ document.getElementById(“”); ➢요소의 class명 ▪ document.getElementsByClassName(“”); ➢요소의 tag 명 ▪ document.getElementsByTagName(“”); ➢ document.querySelector(‘’); ▪ 맨 처음 발견한 것만 반환 ➢ document.querySelectorAll(‘’); ▪ 일치하는 것 모두 반환 2. CSS 조작 ➢innerTEXT ▪ 태그도 문자자체로 인식 ▪ 문자그대로 로 입력 ➢innerHTML ▪ 태그를 변경할 때사용 ▪ 입력하면 줄바꿈 ➢ CSS조작 예시 ▪ addEventListener ✓ 특정 행동시 함수 발동 ✓ 예시에서는 butt..

언어/HTML,CSS,JS 2022.05.31

JavaScript관련 기본개념 : DOM, 함수선언 및 실행(alert, confirm, prompt )등

JavaScript관련 기본개념 컴파일 소스코드를 기계가 이해할 수 있도록 기계어로 번역하는 과정 모든 언어는 컴파일 과정을 거치게 되어 있다. 인터프리터 언어 (interpreter) 실시간으로 실행되는 언어 → 컴파일 언어보다 빠름. 단순하기 때문 (컴파일 언어는 해석하는 컴파일러 과정필요) 예) Javascript , PHP , ASP , Python 반대: 컴파일 언어 등등.. 예) C, C++ , Java , Go DOM Document Object Model 문서 객체 모델 화면의 엘리먼트를 나타내는 것. log 프로그램 흐름 확인위해 남기는 기록 함수 function method, procedure등으로도 불림. 특정 동작을 수행하는 코드 native Java Script 네이티브 자바스크립..

언어/HTML,CSS,JS 2022.05.31

GitHub README.md 꾸미기

써보니까 그래요. Tistory가 Naver blog보다 글 작성하기가 다소 힘든 편이라고 생각했어요. (아니 조금 많ㅇㅣ..) GitHub은 🐶 힘든편이네요. 그래서 단순하지만 무언가는 한 것 처럼 보이는 GitHub README.md 꾸미기를 알려드립니다. 1. 우선 username과 같은 Repository부터 생성 깃허브 로그인 후에 우측 상단의 + 버튼 클릭 New repository 클릭 Owner 명과 같은 Reopository name을 작성해야합니다. 같은 이름을 작성하면 위 이미지처럼 ✨special✨ 이라는 문구가 나옵니다. ✨주의할 점! 지금은 Add a README file 에 체크를 해줘야 편리하게 작성할 수 있습니다. 그러고 나서 Create repositroy 를 눌러 새 R..

SQL 날짜 계산 관련 함수들 (날짜 차이 등)

SQL 시간 계산 함수들 MySQL을 사용하다보니, 일자와 시간차이 계산이 필요한 경우가 많다. 자주 사용하는 것들을 정리해봤다. 들어가기에 앞서 MySQL은 UTC를 기준으로 시간 출력 대한민국 시간대 KST는 UTC+9 UTC 0인 영국 런던시간이 0시일 때, 한국은 9시간 빠른 오전 09시다 따라서 MySQL에 시간 +,- 필요 1) 현재 날짜를 구하는 함수 함수명 역할 current_date() yyyy-mm-dd 형식 출력 now() yyyy-mm-dd hh:mm:ss 형식 출력 current_time() hh:mm:ss 형식 출력 current_timestamp() yyyy-mm-dd hh:mm:ss 형식 출력 # 예) select current_date(); #2022-05-13 select..

Database/SQL 2022.05.13

for each문

for each 문을 쓰면 for 문을 쓸 때 보다 코드가 훨씬 간단해진다. for(타입 값받아줄 변수명 : 출력하고 싶은 자료구조(=배열)) for each문의 장점은 바로, 인덱스를 표기할 필요가없다는 것이다. for each문이 알아서 해당 배열의 처음부터 끝까지 모든 인덱스 값을 다 출력해준다. for each문이라고 부르지만, 표기할 때는 for 만 작성한다. for문으로 출력 시 예제 foreach로 출력 시 예제 int[] arr = {10,11,12,13,14}; for(int i = 0; i < arr.length; i++) { int value = arr[i]; //arr[0]~[4] System.out.println(value); } int[] arr = {10,11,12,13,14}..

언어/JAVA 2022.04.20

Eclipse 이클립스 폰트 변경

Eclipse D2 Coding D2 Coding 폰트는 네이버에서 개발자의 코딩을 위해 만든 글꼴이다. 네이버 나눔바른고딕을 바탕으로 개발됐고, 가독성이 굉장히 좋다. 또한, 한글에 최적화된 글꼴이다. 이클립스 기본 폰트 쓰다가 D2 Coding을 적용하면 개안한 것 같다. 기본폰트로 한글 출력하면 한글이 쭈글쭈글하게 나오는데, D2 Coding으로 글꼴을 설정하면 한글도, 영어도, 숫자도, 기호도 아주 예쁘게 나온다. 이클립스 폰트변경, D2 Coding적용방법 1. Naver github 에서 zip파일 다운로드 Naver github 공식홈페이지 : https://github.com/naver/d2codingfont 2. zip파일 압축해제 후 폰트파일 더블 클릭해서 설치 마우스로 파일 블록 잡고..

언어/JAVA 2022.04.14

풀스택 개발자(Full stack developer) 의미와 필요한 기술

1. 풀스택 개발자 풀스택 개발자는 프론트엔드(Front-end)와 백엔드(back-end)를 모두 다룰 수 있는 개발자를 말한다. 최근에는 프론트엔드, 백엔드 뿐만 아니라 데이터베이스, 모바일, DevOps(소프트웨어 개발과 IT운영담당자가 연계해 협력하는 개발 방법)를 할 수 있어야한다. 1) 프론트엔드 개발자는 웹 프로그래밍의 한 분야로 백엔드의 반대말로 사용되기도한다. 벡엔드 API에서 가져온 데이터 출력, 입력을 통해 비즈니스 로직을 구성하고 사용자가 직접 사용하며 접하게되는 사용자 인터페이스 부분을 작업하는 개발자다. 2) 백엔드 개발자는 프론트에서 요구하는 데이터의 포맷이나 데이터베이스 입출력 및 다양한 비즈니스 프로세스를 코드로 구현하고 이를 위한 DB를 설계하고 백엔드 프레임워크를 이용하..

가위바위보(Rock-Paper-Scissors Game)

문제조건 1. 0은 주먹, 1은 보, 2는 가위 2. 컴퓨터는 무작위로 숫자를 선택하고, 사용자에게는 숫자를 입력받는다. 3. 가위바위보게임은 무한 반복한다. 알고리즘 1. Math.random함수로 컴퓨터가 낼 패를 랜덤으로 정한다. 2. 사용자의 패는 0,1,2로 지정한다. 3. while문으로 가위바위보를 무한 반복한다. 4. 사용자의 선택에 따라 게임을 종료할 수 있게 추가했다. 5. 사용자가 잘못된 숫자를 입력할 경우에는 경고문구를 출력하고 숫자를 다시 입력을 받는다. public class iam_im2 { public static void main(String[] args) { RockPaperScissor(); } public static void RockPaperScissor() { Sc..

언어/JAVA 2022.04.07
728x90