20220620

jungkwanlee·2022년 6월 20일
0

코딩일지

목록 보기
59/108

1) 학습한 내용

jQuery

소개

  • 모든 브라우저에서 실행되는 크라이언트 프로그래밍 언어

  • 2006년 존 레식이 뉴욕 시 바 캠프에서 공식적으로 소개

  • 간략, 강력하게 사용할 수 있도록 설계

  • 가장 인기있는 JavaScript 라이브러리

jQuery의 주요기능

  • CSS 설렉터를 활용한 태그 접근

  • 이벤트 처리

  • 특수 효과 및 애니메이션

  • Ajax

  • JSON 파싱

  • 플러그인을 통한 확장성

  • 멀티 브라우저 지원

jQuery 종류

  • jQuery

가장 기본적인 함수

  • jQuery UI

화면을 구성할 때 사용

  • jQuery Mobile

단말기에 사용

jQuery 사용법

https://jquery.com/에 접속해서 Download jQuery를 클릭한다. 그 다음에 https://code.jquery.com 된 부분을 클릭한다. 그렇게 들어간 다음에 uncompressed를 클릭해서 script에 있는 코드를 복사해서 헤더 태그 사이에 집어넣는다.

정리

jQuery는 JavaScript를 보다 편리하고 강력하게 사용할 수 있게 하도록 만든 JavaScript 라이브러리이다. 그리고, jQuery는 모든 브라우저에서 동일하게 동작하며 다양한 기능을 제공한다.

jQuery 사용법

개발환경 구성

  1. JDK 설치

  2. 이클립스

  3. Apache tomcat

  4. 웹 브라우저

JDK 설치

http://java.sum.com에 접속해서 java에 Java SE를 클릭해서 최신 버전을 다운 받아서 설치를 한다.

Apache tomcat 설치

http://tomcat.apache.org에 접속해서 다운 받을 tomcat을 누른 다음에 원하는 버전을 골라서 다운 받는다.

이클립스(Eclipse) 설치

https//www.eclipse.org에 접속해서 DOWNLOAD를 클릭한 다음에 DOWNLOAD Packages 를 클린한 다음에 2022년 6월 20일 기점으로 Eclipse IDE for Enterprise Java and Web Developers를 다운 받는다.

이클립스 환경 설정

폰트

Window -> Preferences -> General -> Appearance -> Colors and Fonts

인코딩 설정

Window -> Preferences -> General -> Content Types

웹 브라우저 설정

Window -> Preferences -> General -> Web Browser

서버 설정

Window -> Preferences -> Server -> Runtime Environment

프로젝트 만들기

File -> New -> Dynamic Web Project

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1> 개발환경 테스트</h1>
</body>
</html>

'개발환경 테스트에 쓰일 HTML파일의 코드'

tip. 서버 연결이 잘 안돼요.

만약에 Tomcat을 제대로 작동을 멈추지 않고 종료시키면 서버 주소를 바꾸거나(예: 8005 -> 8000) cmd를 작동시킨 다음에 아래의 순서대로 종료시키는 방법이 있다.

  1. netstat -anno tcp

2.taskkill /f /pid PID번호

명령어의 대략적 의미netstat / taskkill - 포트 충돌 강제종료 (Tomcat Port 8080 already in use)

  • a 모든 연결과 수신 대기 포트를 표시합니다.
  • n 주소와 포트 번호를 숫자 형식으로 표시합니다.
  • o 각 연결의 소유자 프로세스 ID를 표시합니다.
  • p proto proto로 지정한 프로토콜의 연결을 표시합니다. proto는 TCP, UDP, TCPv6 또는 UDPv6 중 하나입니다.
  • s 옵션과 함께 사용하여 프로토콜별 통계를 표시할 경우 proto는 IP, IPv6, ICMP, ICMPv6, TCP, TCPv6, UDP 또는 UDPv6 중 하나입니다.
  • p tcp 경우 TCP를 proto로 지정하여 TCP/IP 네트워크 연결을 표시한 것이므로 지정하지 않아도 되고 경우에 따라 다른 프로토콜을 지정해도 된다.

2) 학습내용 중 어려웠던 점

서버 만드는 구간에서 막혀버렸다. 며칠 전, 내가 스프링을 독학 했을 때는 톰캣 9를 실행시켰었는데 이번 수업에는 톰캣10을 통해 실행을 시키는 것인데 뭐가 잘못되었는지 실행이 제대로 되질 않았다.

3) 해결방법

일단, 나는 버전이 달라서 그렇게 된 것인가를 생각해보았다. 하지만, 버전이 달라졌다면 분명히 작성하는 방법에 변형이 있을 수도 있었기에 나는 다시 한 번 강사의 동영상을 보았다. 하지만, 그럼에도 문제가 해결 되지 않자 인터넷을 뒤져서 톰캣에 관한 자료를 뒤졌었고 그러다가 포트 충돌 강제종료를 본 나는 그걸 통해서 포트 강제 종료명령문을 알게 되었고 포트 강제 종료 명령문을 실행시켜서 겨우 서버를 실행시켰다.

4) 학습소감

이번 수업은 jQuery에 관한 간단한 설명과 웹 브라우저가 아닌 방법을 통해 홈페이지를 띄우는 것을 학습하였다. 나는 이클립스를 통해 스프링이란 백엔드를 독학을 하던 참이라 준비가 다 되어 있었다. 하지만, 서버라는 곳에서 막혀버렸고 나는 이후 서버를 뛰어넘기고 수업 진행을 따라갔었다. 이번에는 서버를 좀 더 공부해야 할 필요가 있다.

0개의 댓글

관련 채용 정보