1. jre는 애플릿 및 응용 프로그램을 실행하기 위한 라이브러리, java virtual machine 등을 제공, jdk는 jre의 상위 집합으로 jre에 있는 모든 항목과 컴파일러 및 디버거와 같은 도구 포함. jre는 자바 프로그램 실행만 할 때, jdk는 프로그래밍까지 가능. 2. 환경변수를 설정하는 이유는 자바 프로그램을 컴파일하거나 실행할 때마다 javac(컴파일러)의 전체경로를 제공해야 하기 때문. 또 java파일을 bin디렉토리에 저장해야하는 종속성을 제거(시스템 어디에서나 실행가능) 3. 다른 버전의 jdk를 다운받으면 디렉토리가 다르기 때문에 환경변수 설정을 해줘야 한다. jdk 설치! 이클립스 설치! 인코딩 설정 UTP-8로 변경! bin - first - hello.class 생성..

HTML 구조설계 구조화 설계는 마치 문서를 쓴다고 생각하면 쉽습니다. 현업에서는 Presentation 문서형태의 기획서나 디자인 파일을 받아서 그것을 기반으로 HTML개발을 시작합니다. 즉 어떠한 화면을 보면서 그대로 구현하는 것이죠. 그 화면을 보면서 구조를 분석해야 합니다. 먼저 영역을 나눠서 상단/본문/네비게이션 이런 식으로 큰 부분부터 분리합니다. 그 뒤에 각 영역 안에 내용의 구조를 잡는 것이 일반적입니다. 각 영역 안의 내용 역시 여러 가지 형태일 겁니다. 목록을 나타내거나, 이미지를 나타내거나, 문단을 나타낼 수 있습니다. 이때마다 적절한 태그를 쓰면 됩니다. 그러면서 영역 안에 또 다른 영역이 있다면 점점 안으로 좁혀가면서 HTML tag를 사용하면서 완성해나가는 겁니다. 이때 CSS코..

HTML tag의 종류 (semantic 한 태그다. 의미를 가지고있다.) 태그는 그 의미에 맞춰서 사용해야 합니다. 링크 이미지 목록 제목 anchor 태그, img 태그, ul/li (순서가 없는 목록) 태그, heading 태그, p 태그 등이 자주 사용됩니다. 그 밖에 가장 많이 사용하는 div태그가 있습니다. div 태그는 block 엘리먼트라고 하는데 일반적인 영역을 표현할 때 가장 많이 사용합니다. 많은 태그를 모두 외울 필요는 없으며, 필요한 태그를 찾아서 적절한 의미에 맞는 태그를 사용하는 것이 중요합니다. 태그 이름 치고 탭 하면 나옴! 자동으로 반갑습니다. 여기 여러분들이 좋아하는 과일이 있어요 사과 바나나 메론 귤 계층적인 구조 레이아웃을 위한 태그 레이아웃을 구성하는 태그도 역시 ..

https://jsbin.com/?html,output JS Bin Sample of the bin: jsbin.com javascript코드는 body태그 뒷 부분에 해야 동작이 덜 느려짐 css는 head안에 주로 존재함 css나 jsp가 많아지면 외부 파일 연결 link달아서 웹 서버란? 웹 서버는 소프트웨어(Software)를 보통 말하지만, 웹 서버 소프트웨어가 동작하는 컴퓨터를 말합니다. 웹 서버의 가장 중요한 기능은 클라이언트(Client)가 요청하는 HTML 문서나 각종 리소스(Resource)를 전달하는 것입니다. 웹 브라우저나 웹 크롤러가 요청하는 리소스는 컴퓨터에 저장된 정적(static)인 데이터이거나 동적인 결과가 될 수 있습니다. HTTP로 통신하는 클라이언트와 서버 서버로 부터..

웹프론트엔드? 사용자에게 웹을 통해 다양한 콘텐츠(문서, 동영상, 사진 등)를 제공합니다. 또한, 사용자의 요청(요구사항)에 반응해서 동작합니다. 웹프론트엔드의 역할 웹콘텐츠를 잘 보여주기 위해 구조를 만들어야 합니다.(신문,책등과 같이) - HTML 적절한 배치와 일관된 디자인 등을 제공해야 합니다.(보기 좋게) - CSS 사용자 요청을 잘 반영해야 합니다.(소통하듯이) - Javascript HTML 코드 예시 원하는 문서의 구조를 프로그래밍 언어로 표현해야 합니다. HTML이라는 것은 그 구조를 잘 표현해 줍니다. 우리집에 오신걸 환영합니다 위치 경기도 시흥시 어딘가 위치하고 있어요~ 특징 우리집은 마루가 아주 작아요~ 하지만 옹기종기 모여있기 좋은 구조에요 email : crong@kdd123.c..

HTTP (Hypertext Transfer Protocol)란? HTTP는 서버와 클라이언트가 인터넷상에서 데이터를 주고받기 위한 프로토콜(protocol)입니다 HTTP 작동방식 HTTP는 서버/클라이언트 모델을 따릅니다. 장점 - 불특정 다수를 대상으로 하는 서비스에는 적합하다. - 클라이언트와 서버가 계속 연결된 형태가 아니기 때문에 클라이언트와 서버 간의 최대 연결 수보다 훨씬 많은 요청과 응답을 처리할 수 있다. 단점 - 연결을 끊어버리기 때문에, 클라이언트의 이전 상황을 알 수가 없다. - 이러한 특징을 무상태(Stateless)라고 말한다. - 이러한 특징 때문에 정보를 유지하기 위해서 Cookie와 같은 기술이 등장하게 되었다. URL (Uniform Resource Locator) 특정..

스파르타 웹개발 플러스 과정을 완주했다. 앞서 했던 웹개발 왕초보 과정에서 배운내용을 토대로 하는것이라서 그닥 하기에 막막하지는 않았지만, 뒤로갈수록 코드스니펫 복붙으로 인해 내 스스로 생각하는 시간이 적어져서 아쉬웠다. 그래도 상당히 강의 내용이 쉽게 따라할 수 있었기에 부담없이 나름대로 밀리지 않고 수업을 완주 한것 같다. 또한 스파르타 강의들을 들으면서, 웹개발이라는것이 어떤것인지 맛보는 과정이라고 생각했다. 본격적으로 하나를 깊게 파기보다는 약간 살짝씩 건드려보는느낌? 그 이후에 더 세부적으로 생각하고, 공부하며 만들어나가는건 나의 몫이겠지.. 그렇기에 강의 수강 완료에 그치지 않고, 더 구체적이고 전문적으로 공부해야 할 필요성을 느꼈다. 단순히 코드 복붙이 아닌. 서버와 클라이언트의 정확한 과정..

Bulma로 웹 사이트 꾸미기 : 부트스트랩과 비슷한 기능임 : 무료 css 프레임워크 : 순수 css로 이루어짐 -> 커스터마이징이 쉬움 : 사용법이 부트스트랩보다 훨씬 직관적이고, 시간 단축가능 : 부트스트랩의기본 모양보다 벌마의 기본모양이 이쁨 https://bulma.io/documentation/ Bulma: Free, open source, and modern CSS framework based on Flexbox Bulma is a free, open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free. bulma.io Hero 배너..

셀레니움 배운다. 마침 해킹 점검 툴 코드 짤때 셀레니움에 대해 처음 알게되었는데 오이게 웬걸~ 때마침 배우네 개이득 이번에 배울것 브라우저 제어 - selenium 웹 스크래핑이란? 웹페이지에서 우리가 원하는 부분의 데이터를 수집해오는 것 한국에서는 같은 작업을 크롤링 crawling 이라는 용어로 혼용해서 쓰는 경우가 많습니다. 원래는 크롤링은 자동화하여 주기적으로 웹 상에서 페이지들을 돌아다니며 분류/색인하고 업데이트된 부분을 찾는 등의 일을 하는 것을 뜻해요. 구글 검색을 할 때는 web scraping 으로 검색해야 우리가 배우는 페이지 추출에 대한 결과가 나올 거예요! 참고 Web Scraping(wikipedia) / Web Crawler(wikipedia) Web Scraping vs We..

정적 웹페이지 vs. 동적 웹페이지 동적 웹페이지의 종류 Client-side rendering (CSR) 자바스크립트에 데이터를 포함해서 보낸 후, 클라이언트 쪽에서 HTML을 완성하는 방법 Server-side rendering (SSR) 서버 쪽에서 템플릿 HTML에 데이터를 끼워넣어 완성된 형태의 HTML을 보내주는 방법 복합적인 방법 클라이언트 쪽에서 Ajax 요청을 보내서 서버에서 데이터를 받아와 HTML을 완성하는 방법 서버에 요청들어오면 html에 자바스크립트 심어서 보내주고, 페이지 드고나면 자바스크립트가 돌면서 ajax가 서버로 요청을 보내서 데이터를 받아와서 채워넣음 어렵다. Jinja2 템플릿 언어 Flask 프레임워크에서 사용하는 템플릿 언어 '템플릿'이 되는 HTML 문서에 데이..