본문 바로가기
반응형

Programming256

javascript project #2 시험 템플릿 프로그램 UI 설계 1) 4가지 질문이 출제된다. 2) 각 항목을 선택한 후 Next 버튼을 클릭하면 다음 페이지로 넘어간다. 3) 질문지의 답을 클릭할 때마다 score점수가 올라간다. 4) 모든 질문지가 완성되고 난 후 score을 표기하고, Reload 기능을 구현한다. 주의사항 1) 선택을 하는 기능은 radio 버튼을 이용한다. 2) 선택 후 다음 화면을 넘어갈 때 체크항목을 없애는 기능은 input 태그의 checked속성을 이용한다. 3) 점수는 input태그의 id값과 데이터객체의 항목을 일치시켜 구동시킨다. 4) 버튼을 클릭할 때마다, 버튼의 addEventListener('click', ()=>{}) 메소드를 이용한다. HTML Quiz Application Qestion Qestion Qest.. 2021. 9. 17.
javascript countdown project + input 태그에서 javascript로 데이터 받아오는 방법 javascript project를 간단히 진행한다. CSS는 아직 미완이지만, 간단한 Time coundown을 실행하는 javascript 프로젝트다. UI 설계 먼저 에서 날짜 데이터를 입력하고 submit을 하면 현재 시점으로 days, hours, mins, seconds를 모니터링 해주는 프로젝트다. 사용은 간단한데, 설계 및 프로그래밍 구현이 생각해 볼 거리가 많아서, javascrip beginner들에게 추천하는 project다. project를 해보면서 프로그램을 공부하는 가장 좋은 방법은 자신만의 프로젝트를 계획하고 구현해보는 것이라 생각한다. 먼저 이미 구현되어 있는 서비스의 코드를 전체적으로 한번 보고 스스로 코드로 구현해보면서 전체적인 흐름을 익히다 보면 실력이 성장한 것을 금방.. 2021. 9. 17.
[Web Dev] javascript value 가져오는 방법 javascript에서 HTML의 value값을 가져오는 방법은 간단하다. document.querySelector('#value_id').value document.getElementById('#value_id').value document.getElementByClass('.value_class').value 이런식으로 가져오면 된다. 다음 예제를 보자. 태그의 id를 이용해서 조건문을 가동하는 코드다. 2021. 9. 16.
[Web Dev] javascript value 가져오는 방법 this 키워드 이용방법 javascript value 가져오기 javascript에서 HTML의 value값을 가져오는 방법은 간단하다. document.querySelector('#value_id').value document.getElementById('#value_id').value document.getElementByClass('.value_class').value 이런식으로 가져오면 된다. 다음 예제를 보자. 태그의 id를 이용해서 조건문을 가동하는 코드다. this 키워드 위 소스코드에서 태그내에 작성되는 javascrip 상위 태그를 지향하고 있다. this 키워드를 사용하는 방법은 상위태그 자체를 가리키고 있는 것이 된다. this 키워드 사용방법을 알아보자. 위 소스코드에서 this.value = 'white.. 2021. 9. 16.
[web dev] JSON, XML, YAML이란? JSON, XML, YAML은 기본적으로 프로그램 상에서 전달되는 데이터의 한 양식이다. 예를 들어 지도 앱을 사용한다고 하면, 특정 위도와 적도 주소를 서버에 보내면, 서버는 해당 장소의 주소와, 로드뷰, 주변 정보들을 어떠한 양식으로 정리해서 보내줄 것이다. 정보의 양식이 JSON이 될 수도 있고, XML이 될 수도 있는 것이다. XML XML은 형식을 사용한다. 마치 index.html에서 사용되는 태그별로 정보를 정리하고 보낼 수 있게 되어있다. 한가지 순수정보만 들어갈 수도 있고, 다수의 태그들이 중첩으로 사용되어 들어갈 수도 있다. 대한민국, 서울 JSON XML의 경우 HTML형식을 사용하기 때문에 태그를 여러번 쳐야 하고, 태그별로 나뉜 정보를 한눈에 알아보기 어려운점이 단점이다. JSON.. 2021. 9. 15.
[web dev] 바닐라 자바스크립트란? 바닐라 자바스크립트란? 자바스크립트는 웹/앱에서 강력한 개발언어중 하나이다. 프론트 뿐만 아니라 백엔드 개발시 사용되며, 수많은 웹 브라우저에서 공통적으로 사용되는 언어이기 때문이다. 따라서 웹을 개발하고자 하는 개발자라면 자바스크립트에 대한 이해가 굉장히 필요한 것이다. 자바스크립트 개발자들은 다양한 라이브러리를 이용해 개발을 진행한다. 그 중에서 수많은 프레임워크들이 이 과정을 돕고 있다. 프레임워크의 종류에는 다음이 있다. React.js Vue.js Angular.js Jquery 과거 웹 표준명세가 완성되지 않은 시절이 있었다. 당시에는 다양한 웹 브라우저들이 통일된 동작을 하기 위해 jQeury나 React 프레임워크를 필요로 했다. 하지만 오늘날의 웹은 진화한 ECMAScript을 바탕에 깔.. 2021. 9. 15.
반응형