본문 바로가기
반응형

💻 1. 웹개발_Front end96

[HTML] 01-2 HTML 기본 HTML이란 ? - Hyper Text Markup Language의 줄임말로, 하이퍼텍스트를 마크업하는 언어이다. - 하이퍼텍스트 : 웹 사이트에서 링크를 클릭해서 다른 문서나 사이트로 즉시 이동할 수 있는 기능 - 마크업 언어 : 태그를 이용하여 문서나 데이터의 구조를 명시하는 언어 * 컴퓨터에서 사용하는 파일에는 각각 고유한 형식이 존재하는데 웹사이트에서 사용할 파일의 형식은 *.html 확장자로 구성된 HTML 문서 HTML5 와 CSS3 학습 이유 - 최신 웹 표준에 맞는 웹사이트 제작 가능 (PC, 스마트폰, 태블릿 외 IOT 기기에 맞는 웹 표준이 HTML5이며, CSS3로 다양한 레이아웃 제작 가능) - 앱 및 웹 화면 디자인의 기초 (Java나 C 같은 고급 언어를 사용하지 않아도 쉽게 .. 2021. 9. 5.
[Javascript] 01-1 처음 만나는 자바스크립트 현업 프로젝트 개발 순서 1단계 : 개발 의뢰 받기, 기획안 작성 2단계 : 기획안을 토대로 디자이너가 화면에 보여질 UI(User Interface)를 디자인하여 퍼블리셔에게 전달 3단계 : 퍼블리셔가 그 이미지를 보고 HTML와 CSS를 이용해 화면의 모양을 잡아 정적인 웹문서를 완성한다. 4단계 : 완성된 HTML 문서를 백엔드 개발자에게 전달하고 백엔드 개발자는 ASP, PHP, JSP 등 서버언어를 사용하여 화면에 보이지 않는 부분을 개발 * 정적인 웹문서 : 사용자가 어떤 동작을 해도 작동하지 않는 문서 * 프런트엔드 : HTML, CSS, 자바스크립트, 제이쿼리 등을 이용해 사용자의 눈에 보이는 부분까지만 개발하는 것 * 백엔드가 하는 일 : 프런트엔드 개발자가 만든 회원가입 양식 페이지에서.. 2021. 9. 3.
[UI 설계] 화면 설계 툴 KAKAO oven 사용법 화면설계 & 프로토타이핑 툴 총정리 IT 기획 연구소 (yslab.kr) 한 번쯤 들어봤던 화면설계 & 프로토타이핑 툴 총정리 📌 이 글은 벌써 4년도 넘은 글인데요. 2020년 9월 1일 기준으로 최신 내용을 업데이트 했습니다. 아래 링크를 클릭해주세요! 프로덕트 매니저의 툴, UI 디자이너의 툴 IT 현장에서는 화면 UI를 설계 yslab.kr 카카오 오븐 설치 및 사용법 1. 카카오 오븐 설치 2. 회원가입 3. 프로젝트 만들기 4. 요소 추가하기 5. 아이콘 추가하기 6. 아이콘 크기 및 색상 지정 7. 외부 링크 연결하기 8. 내부 링크 연결하기 9. PowerPoint에 붙이기 2021. 9. 3.
[UI 설계] 요구사항 정의서 날씨 페이지 목 차 1. 프로젝트 목적 1-1. 문제 상황과 목표 1-2. 구현 목표 2. 비즈니스 요구사항 2-1. 기능 요구사항 2-2. 비기능 요구사항 3. 상세 요구사항 4. 유즈 케이스 모델링 5. 최종 요구사항 추적표 1. 프로젝트 목적 1-1. 문제 상황과 목표 - 목표 : 사용자들에게 좀 더 편리하고 간단하게 날씨를 확인할 수 있는 사이트 제공 - 구현 목표 ( 기능 ) 1) 전국 날씨 - 기상청 API를 이용해서 전국의 날씨를 요약해서 표출 2) 지역 날씨 - 기상청 API를 이용해서 사용자 위치 기반 지역 상세 날씨 표출 3) QNA - 회원 가입된 회원에 한해 질의글을 작성하고 관리자가 응답 2. 비즈니스 요구사항 2-1. 기능 요구사항 번호 분류 비즈니스 요구 사항 상세 요구 사항 .. 2021. 9. 3.
[HTML] 01-1 웹 개발 기본 웹 개발 구상도 1. 프론트엔드 - 업무 로직을 화면에서 표출해내는 역할 - HTML / CSS, JS(자바스크립트) -> JQuary + Ajax (비동기통신) 2. 백엔드 - 업무 로직 - JAVA, JSP, PHP - JSP (자바 서버 페이지의 약어로, 원래 백엔드 언어지만 지금은 프론트에서 쓰임) 3. Servlet - 프론트엔드와 백엔드의 모든 기술을 통합해서 웹개발을 도와주는 프레임워크 - JSP, Spring Framework, Spring boot - WEB / WAS 서버 (Tomcat 사용, JEUS / WebtoB) , - WEB / WAS 로 DB와 통신 연결 웹 표준이란 ? - 한 웹 페이지가 어느 브라우저를 사용하는지와 상관 없이 그 웹 페이지가 정상적으로 작동해야함을 의미 -.. 2021. 8. 30.
[Visual Studio Code] 비주얼 스튜디오 코드 설치 비주얼 스튜디오 코드란 ? - 웹 개발을 위해 사용하는 편집기 - 윈도우, 리눅스등 다양한 플랫폼에서 사용 가능 - HTML 태그와 CSS 속성에 대한 설명, 자동완성 기능 제공 - 마켓 플레이스를 이용해 C#, 파이썬, GO, AngularJS 등 최신 웹 개발 기술 통합 사용 가능 비주얼 스튜디오 코드 설치 한국어 팩 다운받기 open in browser 설치 폴더 불러오기 단축키 1. 파일 생성 : Ctrl + N 2. 파일 저장 : Ctrl + S 3. html 구조 자동 작성 : 1번 방법 (! + Tap) 2번 방법 (html:5 + Tap) 4. 실행 : Ctrl + Alt + O 5. zencoding : 2장에서 공부할 예정 2021. 8. 30.
반응형