본문 바로가기

수업내용91

20230719 Andoroid 안드로이드의 4대 컴포넌트 1.Activity -화면을 제어해주는 컨트롤러 역할 2.Service 3.BroadcastReceivier 4.ContentProvider console로 확인해보는 activity의 라이프사이클 레이아웃을 만들기 위해 소스를 수정해보겠다. 아래의 코드가 기존코드인데 이것을 LinearLayout으로 변경해보겠다. 입력한 문자를 아래 textview에 출력해보기 package com.example.step01example; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.EditText; import android.widget.TextVie.. 2023. 7. 19.
20230719 flex 블럭 요소를 가로로 배치하는 테스트에 관련한 수업이다. 블럭 요소를 가로로 배치하는 테스트 div1 div2 div3 div4 div5 위와 같은 코드로 div를 만들면 아래처럼 세로로 출력이된다. style을 추가해줘보겠다(잘 보이게하려고..) 블럭 요소를 가로로 배치하는 테스트 div1 div2 div3 div4 div5 원래 세로로 배치 되던 것이 flex를 사용하여 가로로 배치 되었다. 여기서 width를 제거하게 되면 자식요소들은 필요한 만큼만의 width를 자동으로 갖게 된다. flex-direction을 통해 오른쪽을 기준으로 배치시킬수도 있다. flex-direction의 column과 column-reverse를 사용하면 아래와 같다. flex-wrap의 특징은 아래와 같다. 정렬의 관한.. 2023. 7. 19.
20230718 Poligon 응용해보기 Math.round를 지워도 잘 돌아간다. 위에 폴리곤을 이용해서 사진을 넣는 작업을 해본다 했을 때 만약 사진이 100장이라면 100각형이 될 필요는 없다. 사진이 1000장이 있다고 해서 그 1000장을 모두 데이터로 가져올 필요도 없다. 굉장히 낭비적인 일이다. 앞에 보이는 부분만 내용이 출력되도록 하되 뒤에 내용을 보여질 필요가 없으니 출력 안하도록 하는 것이 좋을 것 같다. 클라이언트가 보는 상황으로 투명도를 줄여 출력은 먼저 안하도록 해보면 개발자 입장에서는 3개의 div만 구현해주면된다. 먼저 간단하게 동물이 들어간 배열을 집어 넣어줘보겠다. 2023. 7. 18.
20230718 AndroidStudio설치/실행 android.com에 접속해서 Android스튜디오 및 SDK에 접속한 후 계속 Next를 눌러 주고 설치를 완료한다. 상당히 오래 걸린다... 아직설치중..10분째.. 설치가 완료된 후에 다음처럼 프로젝트를 만들어 준다. Finish를 눌러준 후에 다시 대기한다.. 안드로이드 스튜디오는 구글이 안드로이드앱 개발을 위해 IntelliJ를 만든 JetBrains에서 만든 통합개발 환경이다. 무료로 제공되고 있으며 Kotlin도 사용이 가능하다. Gradle의 설정이 완료되었다. 새로운 모듈도 만들어보자! Hello2 module을 빌드를 하게 되면 Hello2.apk파일이 생성 된다. 이 작업을 거치면 install을 거쳐서 위에 캡쳐본 처럼 launch가 된다. 하나의 도화지를 만든 느낌이다! 앞으로 .. 2023. 7. 18.
Lombok 다운로드/설치/적용 https://projectlombok.org/download Download projectlombok.org 에서 Lombok을 다운 받아준다음 윈도우-cmd를 실행한다음 Lombok을 설치한 폴더를 찾고 java -jar lombok.jar명령어로 실행 해 준다. 실행하고 난 후 설치할 IDE를 찾아서 설치해준다. 설치 완료 후 화면 설치를 완료한 후에 pom.xml에서 아래와 같이 dependency를 추가해줍니다. org.projectlombok lombok 2023. 7. 17.
20230713 Cube2/Poligon 3d cube 테스트 1 2 3 4 5 6 ← → 위 코드에 문제점은 화살표를 눌렀을 때 딱 한번만 실행이 되고 반대쪽 화살표 버튼을 눌렀을 경우에 180도 돌아가는 문제점이 있다. 그 이유는 document.querySelector("#leftBtn").addEventListener("click", (e)=>{ document.querySelector(".cube").style.transform="translateZ(-200px) rotateY(rotateYt-90deg)"; }); 이 코드 부분에서 rotateY의 설정된 값들이 절대 값이라서 + - 로 이동되는 것이 아니라 좌표값으로 지정되어 있기 때문에 좌표로 이동되는 개념이다. 이를 해결하기 위해 y축을 기준으로 회전하는 값을 저장할 변수를 선언.. 2023. 7. 13.
20230712 3dTransform.html 3D Transform을 배워보는 시간이다 물체와 나의 거리를 perspective라고 한다. 극단 적인 예.. perspective-orgin이란 예를 들어 뚜껑이 없는 상자의 바닥을 내려 보았을 때의 시점이라 생각하면 쉽다. 10% 90%가 적용된 모습이다. transform-origin은 x축 y축 z축이 만나는 지점을 의미한다. 3d transform 테스트 3D Transform을 통해서 정육면체 만들어보기 3d cube 테스트 1 2 3 4 5 6 3d cube 테스트 1 2 3 4 5 6 위에 정육각형을 만든 코드인데 나름 주의할 점은 .cube > div:nth-child(n){ transform: rotaeX(ndeg) translateZ(n px); } 코드 쪽에서 순서가 바뀌면 안된다.. 2023. 7. 12.
20230711 SpringBoot Controller/JSP/MyBatis Controller에 대한 수업! 오늘은 어제 와 다르게 Dependencies를 Spring Boot DevTools와 Spring Web을 추가해 주었다. Spring Boot는 자체 TomCat Server를 내장하고 있다. 예전에는 내가 다운 받은 TomCat Server를 통해 실행을 했었다. Run을 해보면 Port 를 이미 사용하고 있다는 오류가 뜨는데 지금 학원 컴퓨터에서는 오라클 DB가 8080 포트를 사용중이라 application.properties에서 포트 번호를 9000로 지정해준후에 static에 index.html을 생성해주어서 서버가 잘 실행되었는지 확인해 보겠다. 서버가 잘 돌아가는 것을 확인할 수 있다. Context-path까지 설정해주었다!~🫡🫡🫡 Controller설.. 2023. 7. 11.
20230711 CSS3 Animate 오늘은 어제에 이어서 Animation과 Animation을 이용한 박스 만들기를 해보기로 한다 css3 폴더안에 animate.css를 실행해줄 파일을 만들었다. click me! div요소를 동적으로 만들어서 참조값을 얻어내는 작업을 해보았다. 이를 div요소가 아래로 생기지 않고 위에 중복으로 겹쳐서 생기도록 코드해보겠다. box를 click 할 때마다 remove로 삭제를 해주고 난뒤에 makeBox()메서드롤 호출해준다. text대신 이미지를 출력해주려면 배열에 담아서 생성해주면된다👇 2023. 7. 11.