본문 바로가기

728x90
반응형

비전공

[백준 문제 3052번] 나머지 문제 https://www.acmicpc.net/problem/3052 3052번: 나머지 각 수를 42로 나눈 나머지는 39, 40, 41, 0, 1, 2, 40, 41, 0, 1이다. 서로 다른 값은 6개가 있다. www.acmicpc.net 문제 3052) 나머지 문제 문제) 두 자연수 A와 B가 있을 때, A%B는 A를 B로 나눈 나머지 이다. 예를 들어, 7, 14, 27, 38을 3으로 나눈 나머지는 1, 2, 0, 2이다. 수 10개를 입력받은 뒤, 이를 42로 나눈 나머지를 구한다. 그 다음 서로 다른 값이 몇 개 있는지 출력하는 프로그램을 작성하시오. 입력) 첫째 줄부터 열번째 줄 까지 숫자가 한 줄에 하나씩 주어진다. 이 숫자는 1,000보다 작거나 같고, 음이 아닌 정수이다. 출력) 첫째 .. 더보기
[java script] Vue.js ToDo List 만들기 1. ToDo List란? ▷ 할 일을 리스트한 어플리케이션입니다. ◎ 세부 기능 ▷ "체크박스 + 할일"을 나열하여 표시하는 기능 ▷ 체크하면 취소선을 긋는 기능 ▷ "할일"을 추가하는 기능 ▷ 취소선이 그어진 항목을 삭제하는 기능 ▷ ToDo의 총 건수나 처리완료 건수를 표시하는 기능 ToDo리스트 {{todo.text}} 처리완료삭제 {{ remaining }} / {{ todos.length }}건 처리 아래와 같이 값을 넣고 엔터키를 누르면 값이 추가되고 체크한 것은 버튼을 누르면 삭제됩니다. ◎ 추가 세부기능 ▷ 완료일도 같이 입력하여 화면에 나타날 수 있도록 만듭니다. ▷ 완료일 연장을 누르면 기존 입력한 완료일에서 1씩 증가되도록 합니다. ▷ sort를 이용해 할일 또는 완료일 기준으로 오.. 더보기
[UI/UX] Adobe XD를 이용한 실습 및 단축키 사용법 Adobe XD를 사용하여 실습을 해보았습니다! ◎ 아트보드 복사, 붙여넣기 ▷ control + C, control + V ▷ alt키 + 마우스 (도중에 마우스를 떼면 안됩니다!) ◎ 도형 그리기 ▷ 화면 왼쪽의 도형 아이콘을 눌러서 사용하면 됩니다. ▷ 직선, 정사각형, 정삼각형 등을 만드려면 shift키를 같이 누르면 됩니다. 왼쪽 인터페이스 도형 아이콘 아이콘을 이용한 그림 그리기 여기서 펜을 이용해서 그릴때 곡선을 그리려면 클릭한 상태를 유지해 옆으로 마우스를 드래그하면 형성됩니다! 이렇게 반복하면 구름 형상을 그릴 수 있습니다. ▷ 오른쪽 인터페이스의 자물쇠 버튼을 누르면 비율이 고정되고 해제하면 비율 고정 없이 도형의 크기가 변경됩니다! ▷ 내부의 점을 이용하면 모서리를 둥글게 만들 수 있.. 더보기
[UI/UX] 기본 프로세스는? NO STEP 1 STEP 2 STEP 3 STEP 4 1 목표수립 키파인딩 & 인사이트 무드보드 IA설계 2 관련 UX분석 와이어프레임 설계 3 이슈제기 런처아이콘 & 런치스크린 4 리서치 프로토타이핑 1. STEP 1 : 발견단계 ◎ 목표수립 : 현재 당면한 문제, 서비스 구조적 취약점 검토, 비즈니스인 해결책 가설 수립 예시) 배경) 골프레저 대중화 및 많은 경쟁사 등장 젊은층도 골프레저에 관심을 갖기 시작 문제) 일부 연령층 사용, 이용 고객 수 낮음 구조적취약점) 홈페이지가 단순화되어 있고 정보가 부족함 목표:해결책 가설수립) 다양한 연령대가 선호할 수 있도록 홈페이지 디자인을 개선하고, 고객이 필요로하는 컨텐츠를 보강하면 많은 고객층을 확보할 수있을 것입니다. ◎ 관련 UX 분석 1. 시각디자.. 더보기
[UI/UX] UI/UX Design이란? 1. UX(User Experience) : 사용자 경험 ▷ 사용자가 어떤 제품이나 서비스와 상호작용하는 과정에서 얻는 총체적인 경험입니다. ▷ 사용자 경험 디자인 : 익숙함을 전제로 디자인 하는 것 ▷ 예시) 과거의 네이트온과 유사한 카카오톡 ▷ 사용성이 좋다 : UX가 좋음 ▷ 사용성이 나쁘다 : UX에 문제가 있음 ◎ UX 디자인 원리(3가지) (1) 일관성의 원리 ▷ 상단 네비게이션바,신세계 백화점 홈페이지, 이마트, 스타벅스 로고의 위치, SSG 닷컴 (2) 행동유도성의 원리 ▷ 사람이 자연스럽게 행동할 수 있게 하는 시각적인 요소 (3) 정보설계(정보위계) ▷ 페이지 구성을 위한 카테고리 정리 ◎ 원리를 알아야하는 이유? ▷ 디자인에 도움이 됩니다. ▷ 논리력을 키울 수 있습니다. 2. UI(.. 더보기
[java script] Vue.js JSON 데이터 다루기 1. JSON : JavaScript Object Notation ▷ 외부의 데이터를 읽어서 표시하는 방식입니다. ◎ JSON을 읽어 들이는 예제(Vue 사용 x) JSON을 읽어 들이는 예제(JavaScript)- console 출력 if문 안에 있는 내용을 보면 1. 파일을 읽어들이면 FileReader 오브젝트를 만들어서 파일을 처리 2. onload 이벤트로 읽어 들인 후 처리 3. e.target.result에 읽어 들인 데이터가 있는지 전체 데이터 출력 4. JSON.parse 메서드로 JSON 데이터로 변경 5. json 데이터 [0]에 있는 title 출력 6. json 데이터 [0]에 있는 body 출력 ◎ JSON을 읽어 들이는 예제(Vue 사용) JSON을 읽어들이는 예제(Vue.js.. 더보기
[java script] Vue.js 컴포넌트 1. 컴포넌트란? ▷ 부품으로 정리할 때 component를 사용합니다. ◎ 컴포넌트를 만들어 표시하는 예제 컴포넌트를 만들어서 표시하는 예제 (1) HTML부 → 준비된 컴포넌트가 표시됩니다. (2) script부 위와 같은 방법으로 사용하면 됩니다. 결과는 아래와 같은 방법으로 출력됩니다. ◎ 컴포넌트의 data를 function으로 만들기(각각 다른 카운팅 하는 컴포넌트) 예제 각각 다른 카운팅을 하는 컴포넌트 예제 2. props 옵션 : HTML의 태그에서 값을 받아 전달하는 것입니다. // script 부분 : 카멜 케이스 props: { myName: String } // HTML 부분 : 케밥 케이스 위의 형식과 같은 방식으로 연결을 해줘야 컴포넌트가 실행됩니다. my-name과 같은 형식.. 더보기
[java script] Vue.js 애니메이션 효과 적용(transition) 1. transition : 표시/비표시 애니메이션 효과를 나타냅니다. ▷ 나타날(혹은 사라질) HTML 태그를 transition 태그로 감쌉니다. ▷ 어떻게 변화할지를 CSS로 준비합니다. 바로 예제로 알아보도록 하습니다!! ◎ 체크박스를 누르면 애니메이션 효과가 나타나는 예제 체크박스로 표시/비표시 애니메이션 효과를 주는 예제 변경 표시/비표시의 애니메이션~ 애니메이션 효과를 사용할 때 효과를 주고싶은 문구에 으로 감쌉니다. 그리고 어떻게 변화할지 CSS로 준비합니다. 적용 가능한 CSS 스타일 (1) 태그가 나타날 때 ▷ .v-enter : 나타나기 전의 상태 ▷ .v-enter-active : 나타나고 있는 상태 ▷ .v-enter-to : 나타난 상태 (2) 태그가 사라질 때 ▷ .v-leav.. 더보기

728x90
반응형