조반짝의 도전일지

※ Full Screen Landing Page 구현 1. Full Screen Landing Page 구현 : 이미지 파일 용량 줄이기(최적화) landing page 구현시 용량은 적은 이미지를 활용한다! Front-End 웹 Landing Page 구현 시 이미지 파일의 용량이 크면 자칫, 웹사이트 구동에 시간이 걸릴 수 있습니다. 그렇기 때문에, 다음과 같은 이미지 파일 용량을 줄여주는 최적화 웹 사이트를 활용하는 것도 필요합니다. [이미지 파일 용량 줄여주는 최적화 웹사이트 : TinyPNG – Compress WebP, PNG and JPEG images intelligently] https://tinypng.com/ [실습 확인] test.JPG(약 1.8MB) 파일의 용량을 TinyPNG ..

ajax 통신활용 1. HTML 데이터 data.html 파일 새로만들기 id result 안에 html 형식이 들어온다. 프론트 웹에서는 .txt 파일은 문자열을 로우데이터로 불러오고 , 이번에는 html 형식을읽어오는 것이다. 검사창에서 HTML데이터 클릭하면 KBS URL 이 없다가 나타난다. 문자열 데이터 HTML 데이터 data2.html KBS 한국방송공사 2. XML 데이터 xml은 대소문자를 구분한다. xml은 태그(묶어주는 태그, 기준)가 꼭 있어야한다. 웹으로 되어있고 형식이 자유롭다 url: "data3.xml" 와 같은 이름으로 data3.xml 파일을 새로 만든다. append : 기존에 데이터에 추가된다. 문자열 데이터 HTML 데이터 XML 데이터 문자열1-1 문자열1-2 문자..

PLUG IN 01 JQUERY UI jQuery UI jQuery UI jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQue jqueryui.com _draggable 뷰소스에서 들어가야할 부분 복사해서 붙여넣기 파일형식에 맞게 수정한다. 아이디를 클래스형식으로 바꾸고 이름 변경 드래그가 잘 된다. _d..

자바스크립트 기술에 대해 알 수 있는 사이트 https://developer.mozilla.org/ko/ MDN Web Docs The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps. developer.mozilla.org DOM (Document Object Model) HTML 또는 XML document와 상호작용하고 표현하는 API입니다. DOM은 browser에서 로드되며, 노드 트리(각 노드는 document의 부분을 나타냅니다)로 표현하는 document 모델입니다(예, element, 문..

JAVA8 JAVA 설치 자바 설치완료 후 컴퓨터에 설치되었는 지 확인하기 CMD > java -version 아래 처럼 뜨면 설치 완료됨 windows + r > sysdm.cpl: 시스템 속성 실행 > 고급 > 환경변수 > 새로만들기 > windows + R > CMD java -version [엔터] javac-version[엔터] 자바 설치 완료! 아파치 톰캣 아파치 톰캣은 웹 서버와 연동하여 실행 할 수 있는 자바 환경을 제공해서 JSP(java server page)와 자바 servlet이 실행할 수 있는 환경을 만들어주고있다. 아파치톰캣은 자바를 먼저 깔고 설치해야함 설치 후에 하단메뉴표시줄에 오른쪽 configure 클릭 stop 선택 Java, Apache Tomcat 환경 변수 설정 자..

1. 단축키 WINDOWS + E : 파일 탐색기 WINDOWS + R : 실행 실행에 단축어를 넣고 실행하면 빠르게 프로그램을 실행할 수 있다. [OS (exe file) ] chrome 크롬 microsoft-edge: 엣지 iexplore 인터넷 dxdiag 진단도구, 컴퓨터 사양 알 수 있음 calc 계산기 dfrgui inetmgr(WindowsIIS) : 윈도우에서 제공해주는 웹서버 control mstsc(Windows10 Pro 이상 원격제어 : sysdm.cpl – 원격 – 사용자 선택; firewall.cpl) msconfig taskmgr explorer(C:\Users\계정\Desktop) rstrui[시스템 복원] regedit osk 화상 키보드 notepad 메모장 [Tabke..

한줄코딩으로 단축키를 활용할 수 있다. 빨리 코딩 가능! - case1 div>ul>li*3 div>ul>li*3 a>img>span{바로가기} a>img>span{바로가기} 바로가기 - case2 #modal>.modal_up>.uptitle+.upbody+.btn{닫기} 닫기 반응형 확인 시 사이트에 반응형 크기로 보는것이 좋다. 웹접근성 연구소 (wah.or.kr) 웹접근성 연구소 www.wah.or.kr:444 웹표준사이트 참고할 때 좋음 웹퍼블리셔 css에서 활용한 요소 확인 가능 인포메이션에서 위치별 코드 확인 가능

복습 > 프로그래밍 언어는? 인간과 가장 가까운 언어로, OS에 명령을 내리는 것 인터넷 세상에서 잘 듣고 있다가 요청이 오면 응답을 줘!! ➡️ 서버를 만드는 명령 그런데!! 이 프로그래밍 언어들로 서버를 처음부터 다 만든다는 것은 아주 어려운일이다.. 프레임 워크 미리 만들어놓은 블록세트이다. 언어마다 서버를 만들 수 있는 블록세트가 정해져 있다. 서버를 만들 때 프레임워크에서 필요한 기능을 갖다가 쓴다. 스프링 프레임워크에 대한 이해와 경험도도 중요하다. 파이썬은 데이터분석으로 이용됨 장고를 다룰 수 없으면 서버를 못 만든다. 웹 프론트엔드: 우리 눈에 보이는 부분 프론트엔드 언어 자바스크립트 기반의 프레임워크들이 나왔다. 프레임워크를 사용하면 용량을 조금 적게 보낼 수 있거나, 페이지의 깜빡거림이..

클라이언트 개발자하고 미리 한 약속 새로운 기능이 나왔으니 창구를 새로 만들어달라 "OPEN API" 누구나 요청할 수 있게 열어둔 API 공공데이터 개방 추진 사업의 일환으로 많이 열어두는 편임 (통상적으로 누구나 부르지 못하게 못하게 함! ) 웹서버가 기다리면서 리스닝을하고 요청이 오면 기능을 수행 요약 1. API란 창구이자 약속 2.평소에 보는 URL처럼 생김 3.웹, 앱...서버는 상관없다.

변수 main 단축키로 자동으로 명령어 생성 변수: 어떤 데이터를 저장하는 공간 예를들어 배송문자에 고객의 이름에 따라 매번 다른 이름을 적을 수가 없는데 고객의 이름을 변수로 지정하여 메세지를 발송할 수 있다. name이라는 문자열이 변수가 선언됨 조코딩이라는 이름을 변수에 대입해준다. 문자열과 문자열을 더해보자 실행하기 변수를 선언하는 동시에 초기화할 수도 있다. 15시라는 값이 있는데 문자열보다는 정수가 더 어울린다. 15시를 정수형 변수로 만들어보자 숫자는 따옴표가 필요없다 + hour + 변수 넣기 실수값도 변수를 지정해보자 double : 평균점수를 쓰기위함, 정밀한 값을 데이터를 표현하기 적합 char : chareactor , 한글자만 표현할 때, 한 글자는 외따옴표 사용 변수는 언제든지 ..