본문 바로가기

분류 전체보기107

[CSS] Inline, Block, Inline-Block 비교 Inline in the same line(같은 줄에 위치할 수 있다) 의 줄임말 Height(높이)와 Width(넓이) 가 속성을 지정해도 무시 됨. (해당 태그가 마크업하고 있는 Content의 크기 만큼만 공간을 차지하기 때문) margin의 상하 간격이 적용되지 않는다.(위아래가 적용이 안됨.) Block Width,Height,Margin,Padding 모두 적용 가능하다. margin : box의 boader(경계)로부터 바깥 쪽에 있는 공간 padding : box의 boader(경계)로부터 안 쪽에 있는 공간 Inline-Block Inline처럼 줄 바꿈 없이 한 줄에 엘리먼트 나란히 배치. Inline에서 불가능한 Width,Height 조정 및 Margin,Padding 상하 조정이 .. 2021. 3. 26.
[HTML] Semantic HTML이란? What is Semantic HTML? 시맨틱(Semantic)은 "의미의, 의미론적인"이라는 뜻이다. 태그는 non-semantic 태그라고 할 수 있고, , 등 이름만 보고 태그의 역할을 유추 할 수 있는 태그는 semantic 태그라고 볼 수 있다. 예전 HTML 문서들을 보면 를 남발한 non-semantic한 문서들이 많았다고 한다. 하지만 지금은 코드만 봤을 때도 왜 사용했는지 유추가능한 Semantic HTML을 많이 쓴다고 한다. WHY? 검색 엔진은 의미론적 마크업 을 페이지의 검색 랭킹에 영향을 줄 수 있는 중요한 키워드로 간주한다. (SEO 참조). 시각 장애가 있는 사용자가 화면 판독기로 페이지를 탐색할 때 의미론적 마크업을 푯말로 사용. 의미없고 클래스 이름이 붙여져있거나 그렇지.. 2021. 3. 25.
[HTML] OG Tag(Open Graph Tag) 이란? OG Tag 페이스북에서 만들어진 OG Tag는 Open Graph Tag의 줄임말로, 어떤 링크를 공유할 때 어떤 모습으로(미리보기의 제목, 설명, 이미지 등) 보여주고 싶은 지 지정하는 Tag이다. 사용하는 이유 웹 크롤러 또한 하나의 웹 프로그램이기 때문에 HTML 사이트의 3줄 요약이 무엇인지, 무엇이 대표 이미지인지 100% 자동으로 판별하기 어렵다. 사용법 References velog.io/@byeol4001/Meta-Tag-OG%EC%98%A4%ED%94%88%EA%B7%B8%EB%9E%98%ED%94%84-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0 blog.ab180.co/posts/open-graph-as-a-website-preview developers.fac.. 2021. 3. 23.
[MySQL] LAST_INSERT_ID() 사이트의 자유게시판의 게시글을 작성 할 때, 다중파일을 업로드할 수 있게 해주었기에 board 테이블과 file 테이블을 따로 만들어 관리를 하였다. 그럼 서비스에서 이와 같이 게시물을 추가하고 게시물ID를 가져와 그 게시물 ID에 맞게 파일을 넣어줘야 하는데, 게시물 ID는 DB에서 Auto-Increment로 자동생성이 되기 때문에 mapper에서 selectKey를 지정해 주지 않으면 파일 추가 할 때 에러가 나는 것을 확인하였다. oracle을 사용 할때는 Auto_Increment이 없기 때문에 시퀀스를 만들어 주었고, Mapper에서 insert하기 전, 게시판ID가 Null이면 1을 KeyProperty에 넣어줬었다. 이걸 Mysql에서 어떻게 처리할 지 찾아보다가, LAST_INSERT_I.. 2020. 10. 18.
[JSP] 스크립틀릿 Session NPE 체크 프로젝트 사이트의 공통 헤더부분이 다음과 같다. Login과 Register(회원가입) 부분이 항상 공통으로 들어가는데, 로그인이 되었을 때는 세션에 아이디를 체크해서 NULL이 아닐 경우 마이페이지와 로그아웃으로 바꾸려고 하였다. 그러려면 HTML에서 IF문을 써줘야 되는데.. 어떻게 하지 생각하다가 스크립틀릿을 사용해야 겠다고 생각했다. 맨 처음, NULL 체크를 ISEMPTY 함수를 이용해서 하였는데 500에러가 뜨면서 NPE가 발생하였다. 그래서 구글링 하다가 다음 글을 발견하고 (user_id == NULL) 바꿔서 NULL체크를 해서 해결하였다. java.lang.NullPointerException 문제 jsp에서 session 사용 시 java.lang.NullPointerException.. 2020. 10. 15.
[Mac/MySQL] utf8 설정 / Mac & Window 데이터 방식 내 노래 파일들이 있는 fileDTO의 파일명을 불러올 때, 한글로 된 트랙들만 오디오 태그로 불러왔을 때, 재생이 안되는 현상을 경험하였다. 콘솔창을 확인해보니 한글이 깨지는 현상이 발생하였다. mysql db에 저장할 때 한글이 깨진다고 생각하였고, mysql 캐릭터 셋을 utf8로 바꿔주는 작업을 하였다. 구글에 찾아보니 아래와 같이 파일을 복사하라고 나와있다. 파일 복사 $ sudo cp /usr/local/mysql/support-files/my-default.cnf /etc/my.cnf 하지만 support-files 디렉토리에 my-default.cnf가 존재하지 않았다. 그래서 직접 만들어 주기로 했다. cd /usr/local/mysql/support-files 로 디렉토리에 접근하여, .. 2020. 10. 14.
[Spring] service, serviceImpl 구분 이유 / @Resource @Autowired @Inject 차이점 왜 항상 Service는 Service를 만들고 Impl 로 구현하는가 그 해답을 정리하는데 도움이 되는 블로그가 있어 참고 하였다. 내가 내린 한 줄 요약 "Service는 항상 변화 할 여지가 있고 변화에 대응하기 위해 모듈화하여 재사용에 용이하게 만들었다." MVC 구조에서 service와 serviceImpl 이제는 JSP 개발시 MVC 패턴으로 작업하는게 당연시 되고있다. MVC패턴이란 화면에 보여줄 view 에 대한 작업, DB에서 조회 혹은 DB에 저장할 내용을 중간에 가공, 처리하는 비즈니스로직, DB에 연결�� multifrontgarden.tistory.com @Resource @Autowired @Inject 차이점 이것도 항상 궁금했다. 학원에서 배운대로 @Resource를 썼는데,.. 2020. 10. 4.
[Mac/STS] 설치 및 환경설정 STS4 & Eclipse 차이점 STS4 IDE와 Eclipse의 차이도 궁금해서 찾아보았는데, 딱히 큰 차이는 없고 STS4가 이클립스에 비해서는 무겁다고 한다. 잦은 환경구축이 필요한 곳에선 STS가 낫다고 한다. STS 설치 및 환경설정 스프링 부트(Spring Boot) - 프로젝트 구조 알아보기 [개발을 시작해봐요!] 이전 글에서는 자바 JDK 설치, 환경 변수 설정, STS 설치 및 환경 설정, 스프링 부트 프로젝트 생성, 플러그인 설치 등의 작업을 진행하였습니다. 이번에는 생성한 스프링 부트 프로젝트에서 중요�� congsong.tistory.com 1. STS IDE 2. SpringBoot WAS 내장, Java Build Path 등 설정 등 신경 안써도 된다. 3. Thymeleaf.. 2020. 10. 3.
[Mac/AWS] 학습 및 서버 구축 / RDS생성 및 Workbench 연동 인스턴스 만드는 법 Mac OS X에서 AWS 프리티어 EC2 instance 생성 및 접속하기(Ubuntu) AWS (Amazon Web Service)란? wkdtjsgur100.github.io 탄력 IP 등록 과 터미널을 이용한 EC2 접속 [mac] AWS 웹서버 시작하기 - 2 생활코딩 및 jojoldu 님의 블로그를 보며 학습한 내용을 정리한 글입니다.) 목차 1, 2는 이전 AWS 웹서버 시작하기 - 1 글을 확인해주시면 됩니다. 목차 1. 회원가입 2. 인스턴스 생성 3. 탄력 IP 등록 4. easy-h.tistory.com AWS RDS 생성 [AWS] RDS 생성하기 (+MySQL workbench 연동하기) AWS에서 제공하는 RDS(Relational Database Servic.. 2020. 10. 2.
[Spring/Aquerytool] 게시판 만들기 팁 & DB 설계 SpringFrameWork 게시판 만들기 팁 1. 회원가입과 로그인은 마지막에 구성해라. (기간이 촉박하니 가장 중요한 사이트에 대한 걸 먼저 만들고 괜히 회원가입과 로그인에 시간을 뺏기지 말아라.) 2. 이메일주소로 계정찾기/ 질문 답변으로 패스워드 찾기 방식의 오류 언급 요새 아이디 같은 경우 이메일주소로 많이 사용. 그렇기에 이메일 주소로 아이디를 찾는 경우는 의미가 없다. 패스워드를 알려주는 것 자체가 보안실패. 보통 임시비밀번호를 발급하지 비밀번호를 알려주지 않는다. 그렇기에 회원가입에서 id와 email을 다 입력하게 하지 말고 email을 id로 사용하게 유도하라. 3. ERD 모델을 설계 할때 Aquerytool을 이용해보아라.(직관적이고 간편하다.) 4. DB에 긴 내용을 넣을 경우, .. 2020. 10. 1.

티스토리툴바