728x90
๋ฐ˜์‘ํ˜•

์ „์ฒด ๊ธ€ 1364

sessionStorage vs localStorage vs cookie

โœ… sessionStorage vs localStorage vs cookieํ•ญ๋ชฉsessionStoragelocalStoragecookie์œ ์ง€ ๊ธฐ๊ฐ„ํƒญ/์ฐฝ ๋‹ซ์„ ๋•Œ๊นŒ์ง€์˜๊ตฌ (๋ช…์‹œ ์‚ญ์ œ ์ „๊นŒ์ง€)๋งŒ๋ฃŒ์ผ ์„ค์ • ๊ฐ€๋Šฅ์ €์žฅ ์šฉ๋Ÿ‰์•ฝ 5MB์•ฝ 5MB์•ฝ 4KB์ ‘๊ทผ ๋ฒ”์œ„๊ฐ™์€ ํƒญ ๋‚ด์ „์ฒด ๋ธŒ๋ผ์šฐ์ €์ „์ฒด ๋ธŒ๋ผ์šฐ์ €์„œ๋ฒ„ ์ „์†ก ์—ฌ๋ถ€โŒ โŒ โœ… O (์ž๋™ ํฌํ•จ๋จ)์šฉ๋„์ผ์‹œ์  ์ƒํƒœ ์œ ์ง€์‚ฌ์šฉ์ž ์„ค์ •, ๋กœ๊ทธ์ธ ์œ ์ง€์ธ์ฆ, ์„œ๋ฒ„ ํ†ต์‹ ์šฉ ์‹๋ณ„

IT์ง€์‹ 2025.05.24

sessionStorage

โœ… sessionStorage๋ž€?sessionStorage๋Š” ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ œ๊ณตํ•˜๋Š” ํด๋ผ์ด์–ธํŠธ ์ธก ์ €์žฅ์†Œ(Web Storage) ์ค‘ ํ•˜๋‚˜์ž…๋‹ˆ๋‹ค.์›น ํŽ˜์ด์ง€์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์ผ์‹œ์ ์œผ๋กœ, ํƒญ(์„ธ์…˜) ๋‹จ์œ„๋กœ ์ €์žฅํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ค๋‹ˆ๋‹ค.๐Ÿ“Œ ์ฃผ์š” ํŠน์ง•ํ•ญ๋ชฉ๋‚ด์šฉ์ €์žฅ ์œ„์น˜์‚ฌ์šฉ์ž์˜ ๋ธŒ๋ผ์šฐ์ € (ํด๋ผ์ด์–ธํŠธ) ์— ์ €์žฅ์œ ํšจ ๋ฒ”์œ„ํ˜„์žฌ ๋ธŒ๋ผ์šฐ์ € ํƒญ(๋˜๋Š” ์ฐฝ) ์—์„œ๋งŒ ์ ‘๊ทผ ๊ฐ€๋Šฅ์œ ์ง€ ์‹œ๊ฐ„ํƒญ(๋˜๋Š” ์ฐฝ)์„ ๋‹ซ์„ ๋•Œ๊นŒ์ง€ ์œ ์ง€๋จ (์ƒˆ๋กœ๊ณ ์นจ์€ ์œ ์ง€)๋ฐ์ดํ„ฐ ํ˜•์‹๋ฌธ์ž์—ด(string)๋งŒ ์ €์žฅ ๊ฐ€๋Šฅ (๊ฐ์ฒด๋Š” JSON.stringify๋กœ ๋ณ€ํ™˜ ํ•„์š”)์ €์žฅ ์šฉ๋Ÿ‰์ผ๋ฐ˜์ ์œผ๋กœ ์•ฝ 5MB (๋ธŒ๋ผ์šฐ์ €๋งˆ๋‹ค ๋‹ค๋ฅผ ์ˆ˜ ์žˆ์Œ)๋ณด์•ˆHTTP ์š”์ฒญ์— ํฌํ•จ๋˜์ง€ ์•Š์œผ๋ฉฐ, ์„œ๋ฒ„์— ์ž๋™ ์ „์†ก๋˜์ง€ ์•Š์Œ โœ… ์–ธ์ œ ์‚ฌ์šฉํ•˜๋‚˜์š”?sessionStorage๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์ž„์‹œ ๋ฐ์ดํ„ฐ ์ €์žฅ์— ์ ํ•ฉํ•ฉ๋‹ˆ๋‹ค..

IT์ง€์‹ 2025.05.23

[js] sessionStorage.setItem("document.referrer", '');

sessionStorage.setItem("document.referrer", ''); sessionStorage์— "document.referrer" ๋ผ๋Š” ํ‚ค์— ๋นˆ ๋ฌธ์ž์—ด '' ๊ฐ’์„ ์ €์žฅํ•ฉ๋‹ˆ๋‹ค.ํ•˜์ง€๋งŒ document.referrer๋Š” ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์ œ๊ณตํ•˜๋Š” ์ฝ๊ธฐ ์ „์šฉ ์†์„ฑ์ด๋ผ์„œ ์ด๋Ÿฐ ์‹์œผ๋กœ sessionStorage์— ์ €์žฅํ•œ๋‹ค๊ณ  ํ•ด๋„ ์‹ค์ œ document.referrer ๊ฐ’์„ ๋ฐ”๊พธ๋Š” ํšจ๊ณผ๋Š” ์—†์Šต๋‹ˆ๋‹ค.→ ์ฆ‰, ํšจ๊ณผ ์—†๋Š” ์ฝ”๋“œ์ผ ๊ฐ€๋Šฅ์„ฑ์ด ๋†’์Šต๋‹ˆ๋‹ค. document.referrer ์™€ sessionStorage.setItem("document.referrer", '') ์˜ ์ฐจ์ด์™€"์ฝ๊ธฐ ์ „์šฉ(read-only)" ์†์„ฑ์— ๋Œ€ํ•ด ์ž์„ธํžˆ ์„ค๋ช…๋“œ๋ฆฌ๊ฒ ์Šต๋‹ˆ๋‹ค. โœ… 1. document.referrer๋ž€?document.r..

Front/JS & jQuery 2025.05.22

[HTML] ์•ŒํŒŒ๋ฒณ(ํŠนํžˆ ๋„์–ด์“ฐ๊ธฐ ์—†๋Š” ๊ธด ๋ฌธ์ž์—ด)์ด ์ž๋™ ์ค„๋ฐ”๊ฟˆ๋˜์ง€ ์•Š๋Š” ์ด์œ 

โœ… ๋ฌธ์ œ ์›์ธ์˜๋ฌธ์€ ๋„์–ด์“ฐ๊ธฐ(space) ๊ธฐ์ค€์œผ๋กœ ์ค„๋ฐ”๊ฟˆ์„ ์‹œ๋„ํ•จ.ํ•œ๊ธ€์€ ์กฐํ•ฉํ˜• ๊ธ€์ž๋ผ์„œ ๋‹จ์–ด ๊ธธ์ด์— ์ƒ๊ด€์—†์ด ์ž๋™ ์ค„๋ฐ”๊ฟˆ์ด ์ž˜ ๋จ.ํ•˜์ง€๋งŒ ์•ŒํŒŒ๋ฒณ์ด ๋„์–ด์“ฐ๊ธฐ ์—†์ด ๊ณ„์† ์ด์–ด์งˆ ๊ฒฝ์šฐ, ๋ธŒ๋ผ์šฐ์ €๋Š” ์ค„๋ฐ”๊ฟˆ์„ ํ•˜์ง€ ์•Š์Œ → ์š”์†Œ๊ฐ€ ๋„˜์น˜๊ฑฐ๋‚˜ overflow ๋ฐœ์ƒ.โœ… ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•: CSS ์ ์šฉword-break, overflow-wrap, white-space ์†์„ฑ ๋“ฑ์„ ์กฐํ•ฉํ•˜์—ฌ ์ค„๋ฐ”๊ฟˆ์„ ์œ ๋„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.div[name="tdlTtl"] { word-break: break-all; /* ๋‹จ์–ด ์ค‘๊ฐ„์ด๋ผ๋„ ์ค„๋ฐ”๊ฟˆ ํ—ˆ์šฉ */ overflow-wrap: break-word; /* ๊ธด ๋‹จ์–ด๊ฐ€ ๋ฐ•์Šค๋ฅผ ๋„˜๊ธฐ์ง€ ์•Š๊ฒŒ ์ค„๋ฐ”๊ฟˆ */ white-space: normal; /* ํ…์ŠคํŠธ ์ค„๋ฐ”๊ฟˆ ํ—ˆ์šฉ */ } ๋˜๋Š”..

Front/HTML 2025.05.21

[Error][jQuery] Uncaught (in promise) Error: Syntax error, unrecognized expression: ul#[object Object]

Uncaught (in promise) Error: Syntax error, unrecognized expression: ul#[object Object]์›์ธ:jQuery ์„ ํƒ์ž($(), .find(), ๋“ฑ)์— ๊ฐ์ฒด(Object)๋ฅผ ๋ฌธ์ž์—ด์ฒ˜๋Ÿผ ์ „๋‹ฌํ–ˆ๊ธฐ ๋•Œ๋ฌธ์— ๋ฐœ์ƒํ•œ ์˜ค๋ฅ˜์ž…๋‹ˆ๋‹ค.์ฆ‰, ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์ฝ”๋“œ๊ฐ€ ์˜์‹ฌ๋ฉ๋‹ˆ๋‹ค:$('ul#' + someObject)someObject๊ฐ€ ๋ฌธ์ž์—ด์ด ์•„๋‹ˆ๋ผ JavaScript ๊ฐ์ฒด๋ผ๋ฉด, ์œ„ ์ฝ”๋“œ๋Š” ul#[object Object]์ฒ˜๋Ÿผ ์ž˜๋ชป๋œ ์„ ํƒ์ž๋ฅผ ๋งŒ๋“ค์–ด ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•: someObject๊ฐ€ ์‹ค์ œ๋กœ ID ๊ฐ’ ๋˜๋Š” ๋ฌธ์ž์—ด์ธ์ง€ ํ™•์ธํ•˜๊ณ , ๊ฐ์ฒด๋ผ๋ฉด ID ๊ฐ’๋งŒ ์ถ”์ถœํ•˜๋„๋ก ์ˆ˜์ •ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. // ์ˆ˜์ • ๋ฐฉ๋ฒ• 1: ID๋งŒ ์ถ”์ถœํ•ด์„œ ์‚ฌ์šฉ const selector = 'u..

Error 2025.05.20

[HTML] ์•ŒํŒŒ๋ฒณ(ํŠนํžˆ ๋„์–ด์“ฐ๊ธฐ ์—†๋Š” ๊ธด ๋ฌธ์ž์—ด)์ด span์—์„œ๋Š” ์ž๋™ ์ค„๋ฐ”๊ฟˆ ๋˜๋Š” ์ด์œ 

์—์„œ๋Š” ์ค„๋ฐ”๊ฟˆ์ด ๋˜๋Š” ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ผ ์ˆ˜ ์žˆ๋Š” ์ด์œ  โœ… ํ•ต์‹ฌ ์ฐจ์ด: div vs span์š”์†Œ๊ธฐ๋ณธ display ์†์„ฑ์ค„๋ฐ”๊ฟˆ ๋ฐฉ์‹divblock์ค„๋ฐ”๊ฟˆ ๋ฐœ์ƒ (์ž์ฒด๊ฐ€ ํ•œ ์ค„ ์ฐจ์ง€)spaninline์ค„๋ฐ”๊ฟˆ ์•ˆ ๋จ, ํ•˜์ง€๋งŒ ํ…์ŠคํŠธ์ฒ˜๋Ÿผ ๋ถ€๋“œ๋Ÿฝ๊ฒŒ ์ค„ ์•ˆ์—์„œ ๊ฐ๊น€

Front/HTML 2025.05.20

[DB][Oracle] ๋™์ ์œผ๋กœ ์ •๋ ฌ์ด ๋ฐ”๋€” ๋•Œ ํ–‰ ๋ฒˆํ˜ธ ๋งค๊ธฐ๊ธฐ (ROWNUM, ROW_NUMBER())

โœ… ๋ฐฉ๋ฒ• 1: SQL์—์„œ ์—ฌ๋Ÿฌ ์ •๋ ฌ ๊ธฐ์ค€์„ ๋™์ ์œผ๋กœ ์„ค์ • (CASE WHEN ์‚ฌ์šฉ)SELECT ROW_NUMBER() OVER ( ORDER BY CASE WHEN :sort_col = 'emp_id' THEN emp_id END , CASE WHEN :sort_col = 'emp_name' THEN emp_name END , CASE WHEN :sort_col = 'salary' THEN salary END ) AS RN , emp_id , emp_name , salary FROM employees;:sort_col์€ ๋ฐ”์ธ๋”ฉ ๋ณ€์ˆ˜ (์˜ˆ: 'emp_id', 'emp_name', 'salary')์ •๋ ฌ ๊ธฐ์ค€์„ ๋ฐ”๊พธ๋ฉด ๊ทธ์— ๋”ฐ๋ผ..

DB 2025.05.19

[DB][Oracle] ROWNUM / ROW_NUMBER()

โœ… ROWNUM vs ROW_NUMBER() ์ฐจ์ด ์š”์•ฝํ•ญ๋ชฉROWNUMROW_NUMBER() (์œˆ๋„์šฐ ํ•จ์ˆ˜)Oracle ๋ฒ„์ „์˜ค๋ž˜๋œ ๋ฒ„์ „๋„ ์ง€์›10g ์ด์ƒ์ •๋ ฌ ๋ฐ˜์˜ ์—ฌ๋ถ€โŒ ์•ˆ๋จ (์ •๋ ฌ ์ „์— ์ ์šฉ๋จ)โœ… ๊ฐ€๋Šฅ (์ •๋ ฌ ๊ธฐ์ค€ ์ง€์ • ๊ฐ€๋Šฅ)ํŽ˜์ด์ง•์— ์ ํ•ฉํ•œ์ง€โŒ ๋ณต์žกํ•จโœ… ํŽ˜์ด์ง• ๊ตฌํ˜„์— ์ ํ•ฉ

DB 2025.05.18

[Error][SQL][MyBatis] org.apache.ibatis.ognl.OgnlException: source is null for getProperty(null, "crCu1Tp")

org.apache.ibatis.ognl.OgnlException: source is null for getProperty(null, "crCu1Tp") ์ด ์—๋Ÿฌ๋Š” MyBatis์˜ OGNL(Object-Graph Navigation Language) ํ‘œํ˜„์‹์„ ํ‰๊ฐ€ํ•˜๋Š” ์ค‘dldKeyMap์ด null์ด๊ธฐ ๋•Œ๋ฌธ์— ๋ฐœ์ƒํ•œ ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ฆ‰, ์•„๋ž˜ ํ‘œํ˜„์‹์—์„œ: dldKeyMap ์ž์ฒด๊ฐ€ null์ด๋ผ์„œ .crCu1Tp๋ฅผ ํ‰๊ฐ€ํ•˜๋ ค๊ณ  ํ•˜๋‹ค๊ฐ€ OgnlException์ด ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.๐Ÿ” ์›์ธ ์š”์•ฝdldKeyMap์ด null์ธ๋ฐ ๊ทธ ์•ˆ์˜ ํ”„๋กœํผํ‹ฐ์— ์ ‘๊ทผํ•˜๋ ค ํ•ด์„œ ์—๋Ÿฌ ๋ฐœ์ƒ.OGNL์—์„œ๋Š” ์ƒ์œ„ ๊ฐ์ฒด(dldKeyMap)๊ฐ€ null์ผ ๊ฒฝ์šฐ, ๊ทธ ํ•˜์œ„ ํ”„๋กœํผํ‹ฐ์— ์ ‘๊ทผํ•˜๋ฉด ์˜ˆ์™ธ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. โœ… ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•1. dldKeyMap์˜ nul..

Error 2025.05.17

[DB] LISTAGG / STRING_AGG

โœ… 1. ๊ธฐ๋ณธ ๊ฐœ๋…ํ•ญ๋ชฉLISTAGG (Oracle)STRING_AGG (PostgreSQL, SQL Server)๋ชฉ์ ๋ฌธ์ž์—ด ์ง‘๊ณ„ (์—ฌ๋Ÿฌ ํ–‰ → ํ•˜๋‚˜์˜ ๋ฌธ์ž์—ด)๋™์ผ์ง€์› DBOraclePostgreSQL, SQL Server ๋“ฑ๊ธฐ๋ณธ ๊ตฌ๋ฌธLISTAGG(col, ', ') WITHIN GROUP (ORDER BY col)STRING_AGG(col, ', ')์ •๋ ฌWITHIN GROUP (ORDER BY col) ํ•„์š”ORDER BY col ์˜ต์…˜ ์ œ๊ณต (WITHIN GROUP ์•„๋‹˜)์ค‘๋ณต ์ œ๊ฑฐDISTINCT ์„œ๋ธŒ์ฟผ๋ฆฌ ํ•„์š”DISTINCT ๋ฐ”๋กœ ์‚ฌ์šฉ ๊ฐ€๋Šฅ (PostgreSQL 13+) โœ… 2. ์˜ˆ์ œ ๋น„๊ต๐Ÿ“Œ Oracle (LISTAGG)SELECT DEPT_ID , LISTAGG(EMP_NAME, ', ') WIT..

DB 2025.05.16
728x90
๋ฐ˜์‘ํ˜•