전체 글 777

[ CSS ] 색상 고르기 아주 유용한 사이트

# 가장 최근 https://geonlee.tistory.com/51 디자인하면서 어떤 색 고를 지 고민한 적 있잖아? 🤯 CSS 색상 선정을 도와줄 사이트 모음 들어가기 전 웹사이트 제작에서 가장 고민되는 순간 중하나가 CSS(Cascading Style Sheets, 연속적 스타일 시트) 의 색상을 선정하는 순간일 것이다. 색상에 따 geonlee.tistory.com - 1순위 cssgradient.io/ CSS Gradient — Generator, Maker, and Background As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, b..

HTML, CSS 2020.09.02

스프링부트 작업현황... 2020-09-02 수요일

[ TODO ] [ 문제 1 ] 코드, 변수명, 이동경로 싹 다 수정하기 [ 문제 2 ] 그리고나서 다른 사람 닉네임 클릭하면 그 사람 닉네임을 uri로 받아서 멤버를 찾아오 고 멤버의 아이디로 폴더를 다 불러오면 되겠다. [ 문제 3 ] 그리고 폴더를 클릭했는데 작성자가 아니면 수정할 수 없게하고 폴더 상세보기로 들어가서 각 메모장으로 이동할 수 있게 해보자! [ 문제 4 ] 메모장 상세보기에서 댓글을 다는거지. [ 문제 5 ] 폴더 상세보기 페이지가 있고, 폴더 안의 메모장 상세보기가 있는거야. [ 문제 6 ] memoCate table - 댓글 - list - 현재 memo table에 있는거 모두를 동일하게 처리 - dto 만들기 -----------> memoCate 나눌 필요 없음. [ 문제 ..

Java 2020.09.02

스프링부트 작업 현황(2020-09-01 화요일 잠들기 전)

[ 메모장에 있어야 하는 기능, 추가해야 하는 기능 ] - 토스트 에디터 - 토스트 에디터 색상 선택 기능 - 댓글 입력 - 게시물에 동영상 첨부 - 댓글에 이미지 첨부 - 댓글에 동영상 첨부 - My memo - 다른 사람 nickname 클릭하면 그 사람 memo로 이동 - 달력 - TODO List처럼 check box로 관리할 수 있도록 - 코드펜 기능 따라하기(코드펜 기능 알아보기) - PC 버전, 모바일 버전 - 프레임 변경 - 배경색 변경 - 프레임 및 배경색을 테이블을 따로 만들어서 관리 - codepen처럼 복사하기(fork) -> 복사하면 내 memo로 바로 작성이 되는?! - 이전, 다음 버튼 - 게시물 페이징 - 페이징 줄이기 - - memo table (사용자가 메모 카테고리를 만..

Java 2020.09.02

스프링부트 작업 현황 3 (작성일 : 2020-09-01 화요일)

== TODO == [ 문제 5 ] 로그인 아이디, 닉네임, 이메일, 전화번호 중복 확인하는 아작스 코드가 굉장히 중복되고 있음...... [ API 조사 ] [ 샘 유튜브에 프로그램 설치하는거 해놓기 ] [ 발표 준비 및 앞으로 계획 구상 ] [ 문제 6 ] 회원가입을 연속으로 2번했더니 admin2 회원한테서 lastPasswordUpdateDate attr 변수가 null이라는 오류 발생 ==> 해결하기. == DONE == [ 문제 1 ] javascript __replaceAll 샘 코드 참고해서 개선해보기. [ 해결책 ] String.prototype.replaceAll이라는 함수를 범용 common.js에 만들어 놓으셨음. 이 코드를 호출해서 기존 기호를 없애거나 공백을 없애서 return ..

Java 2020.09.01

[ CSS ] 오브젝트 채우기, 위치조정 (object-fit, object-position), overflow 참고사항

overflow 안에 사진, 동영상 채울 때. CSS를 이용하여 나 요소같은 오브젝트들을 비율을 유지한 채로 크기를 조정하는 것은 매우 까다로운 부분이다. 오브젝트들이 출력될 공간이 유동적인 크기가 아닌 고정된 크기라면 더욱 골머리를 썩히게 된다. 이에 대응하는 CSS3 속성에 대하여 살펴보자. object-fit 속성 object-fit 속성은 대체되는 요소의 내용(, , , 등과 같은)이 지정된 너비와 높이에 맞게 장착되는 방식을 지정한다. 이는 프로필 이미지나 고정된 크기의 썸네일을 출력하는 다양한 경우처럼 제각각의 크기를 가진 오브젝트등을 넘겨받아 비율을 유지한 채로 일정한 크기로 재가공하는 경우에 유용하다고 할 수 있다. CSS3의 background-size 속성과 매우 유사하다. object..

HTML, CSS 2020.08.31

[ 자바스크립트 ] javascript 특정문자 모두 바꾸기, replace 쉽게 사용하기

자바스트립트에서 replace 메서드를 사용하면 첫 번째 문자만 치환이 되고 작동이 멈춘다. String 클래스에 replaceAll 메서드를 추가하여 쉽게 문자를 치환 할 수 있다. 설명 : str = str.split("o"); 출력 : ["Hell", " W", "rld"] //해당 문자로 배열이 만들어진다. str = str.join("*"); 출력 : Hell* W*rld //배열을 해당 문자로 합친다. 설명 : replace(/o/g,"*") : o를 *로 전체 치환한다. replace(/o/gi,"*") : o를 *로 대/소문자 구분 없이 전체 치환한다. g : 발생할 모든 pattern에 대한 전역 검색 i : 대/소문자 구분 안함 정규식에서 사용하는 특수문자( . ^ ( ) )를 치환할 ..

javascript 2020.08.31

스프링부트 작업 현황 2 ( 2020-08-31 월요일)

[ 개선해야 하는 점 ] == TODO == == DONE == [ 문제 1 ] 1. 게시물을 작성하면 게시물 상세보기 페이지로 바로 이동 2. 게시물 리스트에서 게시물 상세보기 후 목록으로 가면 해당 리스트로 이동 가능 3. 그러나 게시물을 작성하고, 게시물 상세보기 페이지로 이동 후 목록으로 돌아가려고하면 해당 board를 찾지 못함. [ 해결책 ] - write - doWrite - detail에서 boardCode를 제대로 받아오지 못해서 임의로 uri를 만들어서 넘겨주었음... [ 문제 2 ] 1. 회원가입시 휴대전화 입력 기능 추가해야함. 2. 기존 코드에서 오류 찾아서 수정하기. [ 해결책 ] - 휴대전화번호 길이. - 자바스크립트는 replaceAll 작동하지 않는다. - 그래서 repla..

Java 2020.08.31

참고하기

[ 게시물 리스트, 게시물 작성 2가지 구현 ] 공지사항 게시판 테이블 생성 (notice) MySql table dto 자유게시판 테이블 생성(free) MySql table dto @PathVariable 어노테이션이 뭔지 알아야 할 듯 내용 사용법 매개변수로 전달받은 값을 그대로 사용할 수가 있다. == 게시판 테이블에 필요한 필드 == 2개가 아니라 board는 1개! -> controller, service, dao는 article만 있으면 될 것 같음! (board꺼는 없어도 될 듯) id regDate updateDate delStatus delDate name code [ 예시 ] 자유게시판 localhost:8088/usr/article/write 여기에서 list 여기에서 write 공..

Java 2020.08.20

인코딩이란?

정보의 형태나 형식을 변환하는 처리나 처리 방식이다. 즉, 어떤 정보를 미리 약속한 규칙으로 가공한다고 보면 된다. 1. 인터넷에 좋은 자료가 있어서 첨부 파일을 다운로드 받았는데 글이 다 깨져 있는 경우 2. 어떤 사이트에 들어갔는데 사이트의 내용 글이 깨져 있는 경우 3. 공개된 소스 코드 파일을 다운로드 받았는데 주석 내용이 깨져 있는 경우 4. 내가 전달한 파일이 다른 사람에게는 그 파일 내용이 제대로 보이지 않을 때 원인 : 상대방은 내가 보낸 파일과 동일한 규칙을 가진 인코딩이 아닌 다른 인코딩 방식으로 보기 때문에 내용이 다르게 보이는 것이다.

IT 유용한 정보 2020.07.04

[JSP] page 지시어 속성

page 지시어는 현재의 JSP 페이지를 컨테이너에서 처리하는 데 필요한 각종 속성을 기술하는 부분으로, 대개 소스 코드 맨 앞에(맨 위에)서 볼 수 있다. page 지시어 속성 중에서는 형식 지정을 위한 contentType, 자바 클래스 사용을 위한 import, 오류 페이지 관리를 위한 errorPage, isErrorPage 등을 가장 많이 사용한다. - import import는 자바 import와 동일한 기능을 한다. JSP 스크립트 부분에서 데이터베이스 처리와 기타 외부 패키지나 클래스를 사용해야 하는 경우 기술한다. 기본적으로 다음 패키지를 포함한다. - java.lang.* - javax.servlet.* - javax.servlet.jsp.*

IT 유용한 정보 2020.07.04

컨테이너란?

클라이언트 들이 요청을 하면 웹서버가 받습니다.. APS나 PHP는 IIS, APache서버가 해석하지만. JAVA는 오직 JVM만이 해석할수 있죠? 그래서 자바를 해석할수 있는 녀석이 따로 필요합니다.. 이것이 컨테이너 입니다. 1. 컨테이너란? ex)톰켓 서브릿을 관리(서블릿에 대한 요청을 받고) 답변을 주는 중간 역할을 해주는 녀석.. 클라이언트와 서블릿간의 요청과 답변을 전달해주는 녀석.. 요청을 넘겨받은 컨테이너는 Http Request와 Http response객체를 만들어 서블릿 doPost(), doGet()메서드 중 하나를 호출한다. 클라이언트 -> 웹서버 장비 요청(get)함 -> 웹서버 -> Get -> 컨테이너(자바코드로 이루어짐) -> get(요청) -> 서블릿(자바코드) 클라이언트

IT 유용한 정보 2020.07.04

URL 이란 무엇인가?

URL이란 Uniform Resource Locators의 약자로 사용자가 원하는 정보 자원을 찾기 위해서 해당 정보 자원의 위치와 종류를 파악해야할 때 사용하는 일련의 규칙이며 이 안에는 네트워크 상에 퍼져있는 특정 정보 자원의 종류와 위치가 기록되어 있다. 예를 들어, http://www.abcd.com:80/asd/df/sf.html이라는 는 사이트가 존재한다고 할 때, (물론 존재하지 않는 링크이니 눌러보아도 연결되는 사이트는 없을 것이다.) http:// 이 부분은 프로토콜 부분, www.abcd.com 이 부분은 서버부분, asd/df 이 부분은 자원의 위치 sf.html은 자원이 된다. 서버부분에 대해 더 설명을 하자면, 우리가 흔히 쓰는 www.naver.com과 과 같은 주소는 IP주소에..

IT 유용한 정보 2020.07.04

Dynamic project 생성, servlet 등 기초

1. 먼저 Dynamic Web Project를 생성한다. 2. Project name을 입력하고, Target runtime을 지정해주는데, 기존에 있던 tomcat을 지정하거나, 처음 설치하고 사용하는 경우에는 'New Runtime'을 클릭해서 설치한 tomcat을 지정해주고, JER이 아닌 JDK1.8~~로 지정해주어야 한다. 추가로 지정해줄거 있으면 지정해주고. 3. Servlet class를 만들어 준다 (일반 class가 아님을 숙지해야 한다.) 4. Sevlet 생성 - Java package 입력 중요하다. blog의 경우는 com.sbs.java.blog 라고 만들어주고 사용하고 있다. - Class name은 관례로써 HomeController의 MainServlet이다. 라는 의미...

Java 2020.07.04

도메인, 주소 줄이는 법

※ 도메인이란? ip는 사람이 이해하고 기억하기 어렵기 때문에 이를 위해서 각 ip에 이름을 부여할 수 있게 했는데, 이것을 도메인이라고 한다. 1. 먼저 Dynamic Web Project 파일을 1개 만들어야 한다. 2. ROOT 라는 이름으로 생성한다. (ROOT라는 이름은 임의로 정한 것으로 다른 이름을 사용해도 상관없다) 3. ROOT project 안에 index.jsp라는 JSP 파일을 1개 생성한다. 4. 위와 같이 html 시작 코드를 날리고 location~~~ 코드를 입력한다. 5. 실행할 필요는 없지만 실행해보면 /blog/s/home/main 으로 바로 이동시켜준다. 6. Web project 명은 꼭 대문자로 바탕화면에 저장한다. 7. 그리고나서 fillzilla에서 ROOT, ..

IT 유용한 정보 2020.07.04
728x90
반응형
LIST