일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- TypeScript
- JS
- java
- frontend
- github
- 변수
- HTML
- 그럼에도 불구하고
- 그럼에도불구하고
- @media
- 프론트엔드
- node.js
- node
- webpack
- react
- media query
- CSS
- 코드업
- 자바문제풀이
- 코딩테스트
- react-router-dom
- Servlet
- redux
- 반응형 페이지
- JavaScript
- coding
- git
- cleancode
- 자바
- max-width
- Today
- Total
목록분류 전체보기 (302)
그럼에도 불구하고
게시글을 입력받을 수 있는 html 파일이 있다. post.html 제목 내용: post.java package com.zenghyun.web; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; @WebServlet("/notice-reg") public class post e..
html상에서 get과 post를 사용하여 출력에 미치는 영향을 알아보자. get을 이용한 출력 방식은 https://despiteallthat.tistory.com/26 [Servlet] @WebServlet() / web.xml 이용해보기 본격적으로 Servlet을 이용하여 코딩하고자 한다. 우선 보다좋은 이해를 위해 아래 내용을 참고해보자 https://despiteallthat.tistory.com/25 [Servlet] Servlet이란 무엇일까? 서블릿이란? 클라이언트의 요청을 despiteallthat.tistory.com 이 글에 사용된 예제를 확인해보자. 간단하게 요약하자면, 입력 값으로 7을 받으면, 안녕하세요가 7번 출력되게 만들었다. 하지만, 입력할 내용이 많을 경우 get의 경우 ..
본격적으로 Servlet을 이용하여 코딩하고자 한다. 우선 보다좋은 이해를 위해 아래 내용을 참고해보자 https://despiteallthat.tistory.com/25 [Servlet] Servlet이란 무엇일까? 서블릿이란? 클라이언트의 요청을 처리하고, 그 결과를 반환하는 Servlet 클래스의 구현 규칙을 지킨 자바 웹 프로그래밍 기술이다. 자세히 말하자면, 클라이언트가 어떤 요청을 하면 그 결과를 despiteallthat.tistory.com html 파일과 java 파일을 이용하여 HttpServlet를 구현해볼것이다. hello.html "안녕하세요"를 몇 번 듣고 싶으세요? 여기서 중요한 점은 form 태그의 action 값이 hello로 지정되어 있다는 것이다. 출력 버튼을 누르면 h..
서블릿이란? 클라이언트의 요청을 처리하고, 그 결과를 반환하는 Servlet 클래스의 구현 규칙을 지킨 자바 웹 프로그래밍 기술이다. 자세히 말하자면, 클라이언트가 어떤 요청을 하면 그 결과를 다시 전송해주는 역할을 하는 것이다. 서블릿은 웹 서버 측에서 실행되므로 CGI 방식을 따라야 하며, 웹 서버에 존재하는 수많은 자원에 접근할 수 있어야 하며, 자바 프로그램이므로 자바 문법을 따라야 하며, 자바 서블릿이 실행될 수 있도록 자바 실행 기능을 지원해 주어야 한다. [ Servlet 특징 ] 클라이언트의 요청에 대해 동적으로 작동하는 웹 애플리케이션 컴포넌트이다. html을 사용하여 요청에 응답한다. Java Thread를 이용하여 동작한다. (서블릿이 자바 기술을 사용하여 자바의 특성을 갖고 있기 때..
여러 가지 transition을 사용해보자 code box01 box02 box03 box04 box05 box06 box07 box08 box09 box10 box11 box12 box13 box14 box15 box01 : 기존 width 200px의 두배인 400px만큼 채워짐 box02 : span의 지정색인 pink가 빠지고 darkcyan 색이 보임 box03 : box color -> black / font color -> white로 변경 box04 : height 10px만큼 채워짐 box05 : width 60px만큼 채워짐 box06 : 애니메이션 지연시간 2초 줌 box07 : 좌측 상단부터 우측 하단까지 채워짐 box08 : width 100%를 기준으로 채워짐 box09 : he..
css에서 opacity와 transition-duration 속성을 이용해보자 code inner opacity는 투명도를 의미한다. 0: 보이지 않음 1: 보임 위의 코드에서는 inner 박스의 투명도를 0으로 지정해두어 박스가 보이지 않는다. .box:hover .inner.box { opacity: 1; } . box에 마우스 커서를 놓으면 inner박스의 투명도를 1로 바꾼다. transition-duration: 1s;: 애니메이션이 실행되는 시간을 1초로 지정한다.
CSS에서 flex-direction 기능을 사용해보자. flex-direction: row item1 item2 item3 item4 item5 flex-direction: row-reverse item1 item2 item3 item4 item5 flex-direction: column item1 item2 item3 item4 item5 flex-direction:column-reverse item1 item2 item3 item4 item5 column 상태에서 justify-content:flex-start item1 item2 item3 item4 item5 column 상태에서 justify-content:flex-end item1 item2 item3 item4 item5 flex-dire..
CSS 속성 중에 justify-content를 사용해보자 Code justify-content:flex-start item1 item2 item3 item4 item5 justify-content:flex-end item1 item2 item3 item4 item5 justify-content:center item1 item2 item3 item4 item5 justify-content:space-between item1 item2 item3 item4 item5 justify-content:space-evenly item1 item2 item3 item4 item5 justify-content:space-around item1 item2 item3 item4 item5 현재. container css..
a태그를 사용하여 html내에서 이동하다 보면 뚝뚝 끊기는 것과 같은 이동을 보인다. 이럴 때 scroll-behavior: smooth;를 사용하면 부드럽게 이동할 수 있다. 사용 1Lorem 2Lorem 3Lorem 4Lorem 1Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae molestiae earum dolor maiores quas cumque, quidem, dicta omnis et, velit minima minus possimus atque eius repellat culpa nisi dolorem voluptatem. 맨위로 가기 2Lorem ipsum dolor sit amet consectetur adipisicin..
div와 같은 태그에 width: 200px / height: 200px과 같이 지정해놓고 안에 긴 글을 적어놓았다고 해보자. Test Lorem ipsum dolor sit amet consectetur adipisicing elit. Libero illo veritatis tenetur placeat consectetur numquam, sint fugit, aut quos voluptatum voluptatibus, recusandae sapiente itaque sit qui vero pariatur! Fugiat, nobis. Lorem ipsum dolor sit amet consectetur adipisicing elit. Libero illo veritatis tenetur placeat ..
String 클래스에는 여러가지 메서드가 있다. 이 중에서 자주 쓰이는 메서드에 대해서 적어보려고 한다. 메서드란? : 특정한 작업을 수행하기 위한 명령문들의 집합 .length() String str = "Hong Gil Dong"; int index = str.length(); // ★★ 많이 씀~! ★★ System.out.println("str의 길이: " + index); .length()는 해당 문자의 길이를 알려준다. (띄어쓰기 포함) length는 1부터 시작한다. 즉, str의 길이는 13이다. .indexOf() String str = "Hong Gil Dong"; int index = str.indexOf('o'); System.out.println("맨 앞 소문자 'o'의 위치: "..
자바에서 가장 대표적인 클래스인 String 클래스를 얘기해보려고 한다. String 클래스는 두 가지의 특징을 가지고 있다. 1. 객체 생성법이 두 가지이다. (암시적, 명시적) 2. 한번 생성된 문자열의 내용은 변하지 않는다. (불변의 법칙) //String 클래스 만이 new 없이 heap에서 메모리를 할당받을 수 있다. String s1 = "abc"; String s2 = "abc"; // "abc" 라는 값을 s1과 s2가 주소를 공유하는 것 (암시적 방법) 여기서 s1과 s2를 boolean a = (s1 == s2);라고 묻는다면 결과는 True가 나온다. "abc"라는 값을 s1과 s2가 주소를 공유하기 때문이다. "=="는 클래스간의 비교 시 값이 아닌 주소 값을 비교한다. String..