화면구현6 화면구현 프로젝트 최종 포트폴리오 1. 교육처 : 넥스트아이티교육센터(대전) 2. 포트폴리오 템플릿 출처 : 미리캔버스 3. 구현 내용 요약 (상세한 내용은 포트폴리오 참고) - 회원 CRUD, 로그인과 로그아웃(세션), 게시판 CRUD와 페이징, API 활용(네이버 데이터랩) 및 차트화 4. 재밌었던 점 : 평소 관심 있었던 전통주를 주제로 홈페이지를 만들 수 있어서 재미있었다. 머릿속으로 구상한 내용을 화면으로 최대한 표현해냈고 수업시간에 배웠던 Ajax나 API도 다양하게 활용하여 수업시간에 배웠던 내용을 다시 복습하는 시간이 되었다. 5. 어려웠던 점 : SPRING에 대한 기본 지식이 부족한 상태로 전자정부프레임워크를 사용하여 홈페이지를 만들었기 때문에 MVC를 구현하는 부분에서 부족함이 많았다. 또한, Ajax나 API를 적용.. 2022. 7. 12. javascript - setInterval 활용하여 카운트다운 멈추기 조건 1. 카운트다운 시작 값은 100입니다. 2. 숫자는 1씩 줄어들며, 줄어드는 시간은 0.1초입니다. 3. 30이 되면 카운트다운이 멈추도록 하세요. 4. 줄어드는 도중에 마우스를 클릭해도 카운트다운이 멈추도록 하세요. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 setInterval span{ font-size: 50px; } 숫자를 100부터 카운트하며 30초가 되면 멈춥니다. 100 let span_1 = document.getElementById("span_1"); let countS = parseInt(span_1.text.. 2022. 5. 19. javascript - input 태그에 선언적 함수와 익명함수 연결하기 활용 문제 각각의 input 태그에 함수를 각 조건에 맞게 연결하세요 1. 아래 input 태그를 사용하여 (선언적함수로) 1부터 10까지 합을 구하는 함수를 만든 후 alert 창으로 출력하세요. 2. 아래 input 태그를 사용하여 (익명함수로) 1부터 20까지 합을 구하는 함수를 만든 후 alert 창으로 출력하세요 3. 아래 input 태그를 사용하여 (선언적함수로) 1부터 10까지 수를 배열에 담은 후 배열에 5번째 값을 alert 창으로 출력하세요 4. 아래 input 태그를 사용하여 (익명함수로) 1부터 10까지 수를 배열에 담은 후 배열에 6번째 값을 alert 창으로 출력하세요 답안 결과값 화면구현 수업 세 번째 과제 각 조건에 맞게 함수를 연결하여 alert창으로 출력하는 문제였다. for문.. 2022. 5. 13. javascript - 반지름 값을 입력 받아 원의 둘레 구하기 문제 사용자로부터 fn_prompt() 함수로 반지름을 입력 받아서 원의 둘레를 구하는 함수를 작성하세요. 조건 1. 원 둘레를 계산하기 위해서 파이 값(3.141592653)을 상수로 선언하기 2. 사용자로부터 fn_prompt()으로 입력받은 값과 상수 값으로 결과값을 계산하여 let 변수에 담기 3. toFixed()사용하여 원의 둘레를 소수점 2번째 자리까지 나타내기 코드 입력받는 팝업창 결과 화면 2022. 5. 12. HTML, CSS, JavaScript, jQuery의 정의 HTML 하이퍼텍스트마크업언어의 약자로 웹표준 기술을 총칭하는 말이며, 작은 의미로는 웹문서의 문법을 의미한다. 웹페이지를 만드는데 사용되는 언어이다. ※ 하이퍼텍스트란 단순 텍스트만이 아닌 링크 등의 개념이 포함된 텍스트이다. ※ 마크업언어란 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어이다. HTML은 꺽쇠()로 이루어진 태그를 사용한다. CSS(Cascading Style Sheets) 마크업 문서가 실제 표시되는 방법을 저장한 스타일시트 언어로 웹페이지를 꾸미는 역할을 담당한다. CSS로 마크업 문서 전체의 일관성을 유지할 수 있고, 웹의 성능을 극대화해준다. JavaScript 웹 페이지에서 사용자로부터 특정 이벤트나 입력 값을 받아 동적인 처리를 목적으로 고안된 객체 기반의 스크립트.. 2022. 5. 10. 이전 1 2 다음
