혹시 JAVA로 HTML 파일을 생성하고 코딩해야하는데
어려움을 겪고 계신가요..?
제가 그 어려움 함께 하겠습니다 🤕
📖 index.html 파일 생성
new File 과 BufferedWriter, IOException을 이용하려면
상단 import java.io.* 필요
try {
File file = new File("index.html");
BufferedWriter writer = new BufferedWriter(new FileWriter(file));
writer.write("hello world");
writer.close();
} catch (IOException e) {
e.printStackTrace();
}
Run시켜보면 index.html 파일이 생성된 것을 확인할 수 있다.
writer.write를 통해 hello world가 body문 안에 들어온 것이 보인다.
🔧 html 파일 수정
html 파일을 생성했지만, 그럴싸한 홈페이지로 보이기 위해선 수정이 필요하다.
java 내에서 어떻게 수정을 할까 검색을 했지만 나오는건 JS로 수정하는 방법이었다. 그러다 out.println으로 head를 수정하는 글을 보게 되었고, 위에서 출력을 사용한 writer.write를 이용해보기로 했다.
writer.write("<h2> hello world </h2>");
글자 크기를 조정하는 h2를 시험삼아 출력해보니 폰트 사이즈가 커지고, <> 괄호는 표면적으로 안보이는 것을 확인 할 수 있었다.
🥠 테이블 생성하기
이런식으로 코딩하면 편한데 writer.write은 println처럼 자동으로 엔터가 쳐지지 않는다는 불편함이 있다.
writer.write("<head>");
writer.write("<h2> hello world</h2>");
writer.write("<meta charset=\"utf-8\"/>");
개발자 도구 [source]에서 head와 meta charset이 정돈이 안된 것을 확인 할 수 있다. (elemets에서는 자동으로 정돈되어 있던데 source 상에서 정돈이 안되어있어도 되나요?)
나는 source만 보고 있었기 때문에 엔터와 tab이 없는 html이 매우 불편했고.
writer.write("\n");평소와 같이 \n을 했지만 엔터가 쉽게 먹히지 않았다.
윈도우는 \r\n을 같이 쓰고 맥은 \n 리눅스는 \r을 쓴다고 한다..!
해결 방안 : \r\n을 같이 쓰기
writer.write("<head>");
writer.write("<h2>hello world</h2>");
writer.write("\r\n\t <meta charset=\\\"UTF-8\\\"/>");
writer.write("\r\n\t <style>\r\n\t\t");
writer.write("table {border-collapse:collapse; width:100%;}");
writer.write("\r\n\t\t th,td{border:solid 1px #000;padding:10px 5px;}");
writer.write("\r\n\t </style>\r\n</head>");
/*테이블 생성*/
writer.write("\r\n <body><table>\r\n");
writer.write("\r\n\t<tr>");
writer.write("\r\n\t\t<th>name</th><th>gender</tr></tr>");
\r\n과 \t를 이용하니 .. 깔 -끔해진 것을 확인 할 수 있다 ;ㅅ; (elements 상에서는 이걸 진행 하나 안하나 똑같이 잘 정리 되어 있기 때문에.. 노가다로 정돈해주지 않아도 결과값은 똑같긴 하다. 이미 노가다 정돈을 끝내고 늦게 elements를 확인해서 엉엉 울었다. )
블로그도 올리고 git도 차근 차근 정리해야하는데 늘 쓰는게 귀찮아서 (.. ) 이정도면 정리 잘했다 나 자신 !!
아무튼 Java도 배우고 html도 짜볼 수 있는 좋은 기회였다 . . . .
- Full Code
https://github.com/mingsomm/Java-BackEnd-Study/tree/main/proj02 - Thumbnail
'썸네일 메이커(Thumbnail Maker) 만들기 | Toy Project' https://velog.io/@oneook/%EC%8D%B8%EB%84%A4%EC%9D%BC-%EB%A9%94%EC%9D%B4%EC%BB%A4Thumbnail-Maker-Toy-Project - Reference
'HTML+CSS (기초) table 스타일 적용하기' ( https://lcw126.tistory.com/139 )
'2019.01.30 JAVA에서 HTML문서 만들기' (https://invertko.tistory.com/71)
