본문 바로가기
728x90
반응형

124

[back] 자바의 직렬화 (Serialzation : implements Serializable) 자바의 직렬화 (implements Serializable) 1. java에서 직렬화란? 데이터 객체를 전송하기 쉬운 형태로, 객체 상태를 저장하는 일련의 바이트로 바꾸는 과정 (자료구조 저장) 처음에는 이렇게 적어놓은 글들을 보면서 뭔말이지 싶었는데 이렇게 말고는 설명할 방법이 .. 2. 직렬화를 사용하는 이유 구글링 해서 접한 여러 글들을 읽어봤을 때, 내가 이해한 바는 이렇다. - 시스템과 시스템 간에, 네트워크로 데이터 교환을 하기 위해서는 서로 데이터를 알아먹을 수 있는 자료구조 양식(class)이 있어야하고, 그 양식이 이 양식인지 알아차리기 위해서는 양식번호(serialVersionUID)가 있어야 한다. 내가 사용자에게 이름과 연락처를 적을 수 있는 양식을 줬지만, 사용자는 그 양식이 어떤.. 2024. 2. 1.
[front] 카카오톡 공유하기 이미지 수정하기, og:image 종종 공유하기 버튼이 들어가는 이벤트 페이지를 개발하면, 클라이언트가 특정 이미지가 공유되길 원할 때가 있다. 그럴 때 수정하는 곳이 og 태그. 태그 안에 작성해주면 된다 !! 예제 ) 내 티스토리 블로그 를 공유했을 때 1. og 태그란 - 오픈그래프 프로토콜을 의미 (창시자는 페이스북이라고 한다) - 메타태그의 property가 og로 지정되어 있는 정보를 긁어올 수 있다. 즉, 사용자가 페이지에 진입하기 전에 미리보기용 정보를 가져올 수 있게 하는 태그다. 보통 title, image, description, url을 설정한다. image의 크기는 최소 6060x315px , 1.91:1의 비율, 권장 사이즈는 1200x630px이라고 하는데,, 이미지 크기 관련해서는 https://ogp.me/ 2024. 2. 1.
[front] Uncaught TypeError: object.function is not a function (jQuery와 javascript, node 가져오는 방법의 차이) 제이쿼리로 노드를 가져온 것 같은데, 해당 노드의 함수나 프로퍼티에 접근이 안될 때가 있다. 그럴 때 Uncaught TypeError: object.function is not a function 에러 발생함 이런 경우 내가 노드에 제대로 접근을 했나 봐야한다. 가져온 노드를 콘솔에 찍어보면 '? 이건뭐지?' 할 때가 있어서 정리해보려고 한다. 예1) $("#selector").val() -> jquery 함수로 value 접근 $("#selector")[0].value -> dom property로 value 접근 document.getElementById("selector").value -> dom property로 value 접근 예2) $("#selector").attr('checked') ->.. 2024. 1. 30.
[front] disabled 가 아닌 노드 찾기 특정 input을 비활성화(disabled) 시키고, 비활성화되지 않은 노드들만 골라서 처리해야 할 때 var enablePerson = $('input[id^=person_]:enabled'); :enabled 속성을 사용하면 됨 2024. 1. 30.
[front] $(document).ready(function(){}) 자바스크립트 버전? $(document).ready(function(){}) 자바스크립트 버전을 찾아보면 아래 script가 나온다. EventTarget.addEventListener(event, function()) 함수는 EventTarget에 event가 발생 했을 때, function() 을 작동시킨다. 그렇다면 document 에서 발생하는 DOMContentLoaded 이벤트는 무엇일깡 간단한 결론만 말하면, HTML문서가 완전히 파싱 / 로드되기 전에, DOM 트리가 완성되는 즉시 발생하는 이벤트이다. https://ko.javascript.info/onload-ondomcontentloaded DOMContentLoaded, load, beforeunload, unload 이벤트 ko.javascript.i.. 2024. 1. 30.
[front] 브라우저의 렌더링 과정 1. 사용자가 웹페이지 방문 (url 호출) 2. url 에 해당하는 웹페이지의 내용이 바이트 형식으로 리턴됨 (예: 110111... ) 3. 사용자의 브라우저가 리턴받은 내용(바이트) 해석해서 웹페이지를 그려줌 3-1. 10110.. 형태로 리턴받은 바이트 데이터를 ' ...' 문자로 변환 -> 문자 내용을 '{stratTag: 'html' ... }' 와 같이 토큰화함 -> 토큰을 노드로 변환 -> DOM(Document Object Model) Tree 구성 3-2. 동일한 방식으로 Css도 파싱진행 -> CSSOM Tree 구성 3-3. DOM 트리 + CSSOM 트리 => 렌더링 트리 구성 3-4. 렌더링 트리를 기준으로, 그려질 노드와 노드의 스타일 / 크기 등.. 2024. 1. 30.
<a> 태그나 <button>이 아니어도 클릭 가능한 것처럼 커서 보여주기 a태그나 button 이 아니어도 클릭 가능한 것처럼 커서 보여주기 style 에 cursor:pointer 삽입 문의유형 제목 작성자 1 title1 user1 2 title2 user1 이렇게 하고 onclick 이벤트를 걸어 상세화면으로 이동 가능하도록 구현했다. 2024. 1. 30.
[back] java.sql.SQLException: 부적합한 열 이름 잘 되던 화면이 갑자기 빨간줄 띄우면서 500에러가 나기 시작 ### Cause: java.sql.SQLException: 부적합한 열 이름 ; bad SQL grammar []; nested exception is java.sql.SQLException: 부적합한 열 이름 at org.springframework.jdbc.support.SQLErrorCodeSQLExceptionTranslator.doTranslate(SQLErrorCodeSQLExceptionTranslator.java:237) at org.springframework.jdbc.support.AbstractFallbackSQLExceptionTranslator.translate(AbstractFallbackSQLExceptionTra.. 2024. 1. 25.
[front] JSON.stringify() 와 JSON.parse() 1. JSON.stringify() javascript ------> server 자바스크립트로 데이터 보낼 때 문자열 변환 2. JSON.parse() javascript [Javascript] JSON.parse(), JSON.stringify()가 무엇인지와 왜 쓰는지 문제 상황 & 문제 인식 > 여느 때와 다름없이 회사의 업무를 보고 있었다. 특정 api에 axios 요청을 한 후, react-query를 이용하여 받아온 res 값을 파싱하여 화면에 띄워주는 일을 하고 있었다. 요청을 velog.io https://holjjack.tistory.com/79 [Javascript] JSON.parse(), JSON.stringify() 사용 방법 Back-End를 개발하다보면, JSON을 이용해서 .. 2024. 1. 11.
[back] ViewResolver decorator 오류 개발의 참맛 중 하나는 삽질하다가 해결됐을 때의 도파민이 아닐 까.....흑흑 아무튼 나는 - 사이트 구조의 통일성을 위해, 공통 헤더/푸터 파일이 있고, 기본 레이아웃에서 해당 헤더/푸터를 불러오도록 한 상황 - 위의 구조로 만든 레이아웃 파일이 모든 페이지에 적용되도록 web.xml과 decorators.xml 에 decorators 옵션값 세팅 ... sitemesh com.opensymphony.module.sitemesh.filter.PageFilter sitemesh /* ... /* ... 을 했으나 url을 호출해도 decorators 파일이 적용되지 않았다. 하루정도 버리고 해결했는데 .. @Controller public class TestController extends BaseCon.. 2024. 1. 8.
728x90
반응형

티스토리툴바