๋ฐ˜์‘ํ˜•

Framework 87

[Springboot] ์Šคํ”„๋ง๋ถ€ํŠธ + ๋ชฝ๊ณ (mongo)์—์„œ OR ์ฟผ๋ฆฌ query ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ• (+ Criteria)

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” ์Šคํ”„๋ง๋ถ€ํŠธ + ๋ชฝ๊ณ (mongo)์—์„œ OR ์ฟผ๋ฆฌ query ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. How to do Criteria API๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์•„๋ž˜์™€ ๊ฐ™์ด ์‚ฌ์šฉํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค. Criteria criteria = new Criteria(); criteria.orOperator(Criteria.where("A").is(10),Criteria.where("B").is(20)); Query query = new Query(criteria); mongoOps.find(query, .class, "collectionName"); +) ์ฐธ๊ณ ๋กœ Criteria ์€ ๊ธฐ์ค€๊ฐ’์ด๋ผ๋Š” ์˜๋ฏธํž™๋‹ˆ๋‹ค. find ๋ฉ”์†Œ๋“œ ์•ˆ์—์„œ { age: { $gt: 18 } } ์™€ ๊ฐ™์€ ์กฐ๊ฑด๋ฌธ์„ ์ž…๋ ฅํ•˜๋Š” ๋ถ€๋ถ„..

[React] ๊ธฐ์กด ๋ฐ์ดํ„ฐ์—์„œ API Fetching ํ›„(๋”๋ณด๊ธฐ ๋ฒ„ํŠผ ํด๋ฆญ ํ›„) ์ƒˆ๋กœ ๋ถˆ๋Ÿฌ์˜จ ๋ฐ์ดํ„ฐ ํ•ฉ์น˜๋Š” ๋ฐฉ๋ฒ• / ๋”๋ณด๊ธฐ ๋ฒ„ํŠผ ํŽ˜์ด์ง€๋„ค์ด์…˜

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” React์—์„œ ๊ธฐ์กด ๋ฐ์ดํ„ฐ์—์„œ ๋”๋ณด๊ธฐ ๋ฒ„ํŠผ ํด๋ฆญ ํ›„ ์ƒˆ๋กœ ๋ถˆ๋Ÿฌ์˜จ ๋ฐ์ดํ„ฐ ํ•ฉ์น˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ๊ณต์ง€์‚ฌํ•ญ ๋ชฉ๋ก ์กฐํšŒ ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•˜๋˜ ๋„์ค‘ ๋ฆฌ์ŠคํŠธ๊ฐ€ ๋งŽ์•„์งˆ ์ˆ˜ ์žˆ์„ ๊ฒƒ ๊ฐ™์•„ ๋”๋ณด๊ธฐ ๋ฒ„ํŠผ UI๋ฅผ ์ถ”๊ฐ€ํ•˜๊ธฐ๋กœ ๊ฒฐ์ •ํ–ˆ์Šต๋‹ˆ๋‹ค. ์ฐธ๊ณ ๋กœ API๋Š” ์Šคํ”„๋ง๋ถ€ํŠธ์˜ Pageable ๋ฅผ ์‚ฌ์šฉํ–ˆ์Šต๋‹ˆ๋‹ค. ์ฆ‰ ๊ธฐ์กด ๋ฐ์ดํ„ฐ์—์„œ ๋”๋ณด๊ธฐ ๋ฒ„ํŠผ UI๋ฅผ ํด๋ฆญํ•  ๋•Œ๋งˆ๋‹ค page ๊ฐ€ +1 ์”ฉ ์ฆ๊ฐ€ํ•˜๋ฉด์„œ ์ƒˆ๋กœ ๋ถˆ๋Ÿฌ์˜จ ๋ฐ์ดํ„ฐ๋ฅผ ํ™”๋ฉด์— ๋ณด์—ฌ์ค˜์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค. How to implement ์•„๋ž˜์™€ ๊ฐ™์ด NoticeList ์ปดํฌ๋„ŒํŠธ๊ฐ€ ์žˆ๋‹ค๊ณ  ๊ฐ€์ •ํ•ด๋ด…์‹œ๋‹ค. fetchNotice๋ผ๋Š” ํ•จ์ˆ˜๋ฅผ ๋ถˆ๋Ÿฌ์˜ฌ ๋•Œ๋งˆ๋‹ค, ๊ธฐ์กด ๋ฐ์ดํ„ฐ์— ์ƒˆ๋กœ ๋ถˆ๋ ค์ง„ ๋ฐ์ดํ„ฐ๋ฅผ ์ถ”๊ฐ€ํ•ด์ค˜์•ผ ํ•ฉ๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์œ„ ์ฝ”๋“œ์—์„œ๋Š” ์ƒˆ๋กœ ๋ถˆ๋ ค์ง„ ๋ฐ์ดํ„ฐ๋งŒ์„ setN..

Framework/React 2023.02.11

[Springboot] JPA Projection ํ”„๋กœ์ ์…˜ ํ•˜๋Š” ๋ฐฉ๋ฒ•

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” Springboot ์Šคํ”„๋ง๋ถ€ํŠธ JPA์—์„œ ํ”„๋กœ์ ์…˜ ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. Projection? ๋จผ์ € ๋“ค์–ด๊ฐ€๊ธฐ์— ์•ž์„œ ๊ฐ„๋‹จํ•˜๊ฒŒ ํ”„๋กœ์ ์…˜์— ๋Œ€ํ•œ ์˜๋ฏธ๋ฅผ ์‚ดํŽด๋ณผ๊ฒŒ์š”. ํ”„๋กœ์ ์…˜์€ ์—”ํ‹ฐํ‹ฐ์˜ ์†์„ฑ์ด ๋งŽ์„ ๋•Œ ์ผ๋ถ€ ๋ฐ์ดํ„ฐ๋งŒ ๊ฐ€์ ธ์˜ค๋Š” ๋ฐฉ๋ฒ•์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค. ๋” ์ž์„ธํ•œ ๋‚ด์šฉ์ด ๊ถ๊ธˆํ•˜์‹œ๋ฉด ์ผ์ „์— ์ œ๊ฐ€ ์ •๋ฆฌํ•ด๋†“์€ ํฌ์ŠคํŒ… ์ฐธ๊ณ  ๋ฐ”๋ž๋‹ˆ๋‹ค :) [MongoDB] ํ”„๋กœ์ ์…˜ (Projection) ์ด๋ž€? projection query ์‚ฌ์šฉ๋ฒ• How to do ์•„๋ž˜์˜ User domain ๊ฐ์ฒด๋ฅผ ์ฐธ๊ณ ํ•˜์—ฌ ์„ค๋ช…ํ•ด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. @Document(collection = "user") class User( val userId: String?, val userName: String?, val user..

[Springboot] Postman Rest API ์š”์ฒญ Getting not supported media type error / 415 Unsupported MediaType

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์Šคํ”„๋ง๋ถ€ํŠธ์—์„œ Api ํ…Œ์ŠคํŠธ๋ฅผ ํ•˜๊ธฐ ์œ„ํ•ด postman ์„ ์‚ฌ์šฉํ•˜๋˜ ๋„์ค‘ ๋‹ค์Œ์˜ ์• ๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค. 415 Unsupported MediaType ์ฐธ๊ณ ๋กœ, ์ €๋Š” ์ปจํŠธ๋กค๋Ÿฌ ๋‹จ์—์„œ @PostMapping๊ณผ @RequestBody ์–ด๋…ธํ…Œ์ด์…˜์„ ์‚ฌ์šฉํ–ˆ๊ณ , Put ์š”์ฒญ์œผ๋กœ ์•„๋ž˜ ๋‚ด์šฉ์„ ์ „๋‹ฌํ•ด ์—…๋ฐ์ดํŠธ๋ฅผ ์‹œ์ผœ์ค˜์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค. { "isOwner": true, "isStaff": false, } Why? ์ง€์›ํ•˜์ง€ ์•Š๋Š” ๋ฏธ๋””์–ด ํƒ€์ž…์ด๋ผ๋Š” ์˜๋ฏธ์ž…๋‹ˆ๋‹ค. ์†Œ์Šค ์ž์ฒด์— ๋ฌธ์ œ๊ฐ€ ์žˆ๋Š” ์ค„ ์•Œ๊ณ , ์—ด์‹ฌํžˆ ๊ตฌ๊ธ€๋ง ํ–ˆ์ง€๋งŒ ๋ฌธ์ œ๋Š” ๋”ฐ๋กœ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. How to solve the problem ์ฒ˜์Œ ํ…Œ์ŠคํŠธ๋ฅผ ์œ„ํ•ด Postman > Body ํƒญ > raw๋ฅผ ์„ ํƒ ํ›„ ํ•ด๋‹น json ํŒŒ์ผ์„ ๋„ฃ์–ด ์š”์ฒญ์„ ํ•ด์คฌ๋Š”๋ฐ์š”, ์•Œ๊ณ ..

[Springboot] ์Šคํ”„๋ง๋ถ€ํŠธ+์ฝ”ํ‹€๋ฆฐ jar.enabled = true not working ์˜ค๋ฅ˜ ๋ฐœ์ƒ

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. Springboot + kotlin ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์—์„œ gradle ์„ค์ •์˜ "jar.enabled = true" ์ด ๋™์ž‘ํ•˜์ง€ ์•Š๋Š” ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•˜์˜€์Šต๋‹ˆ๋‹ค. ์ผ๋ฐ˜ Springboot + Java ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์—์„œ๋Š” ๋‹ค์Œ์˜ ์„ค์ •์ด ์ž˜ ์ž‘๋™ํ•˜๋Š”๋ฐ, ์ฝ”ํ‹€๋ฆฐ์—์„œ๋Š” ์ž‘๋™ํ•˜์ง€ ์•Š๋”๋ผ๊ณ ์š”. How to solve the problem ๊ตฌ๊ธ€๋ง ํ›„, ์•„๋ž˜์˜ ์ฝ”๋“œ๋ฅผ ์ฐพ์•„ ์ ์šฉํ•ด๋ดค๋”๋‹ˆ ์ •์ƒ์ ์œผ๋กœ ์ž‘๋™ํ•˜์˜€์Šต๋‹ˆ๋‹ค. ์ด ์™ธ์—๋„ ์—ฌ๋Ÿฌ ๋ฐฉ๋ฒ•์ด ์žˆ๋Š” ๊ฒƒ ๊ฐ™์œผ๋‹ˆ ํฌ์ŠคํŒ… ํ•˜๋‹จ ์‚ฌ์ดํŠธ๋ฅผ ์ฐธ๊ณ ํ•ด์ฃผ์‹œ๋ฉด ์ข‹์„ ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. tasks.withType { archiveBaseName.set("octo-mobile-api") } https://github.com/spring-projects/spring-boot/issues/10238

[Springboot] gradlew command not found / IntelliJ ์ธํ…”๋ฆฌ์ œ์ด gradlew ๋นŒ๋“œ ์˜ค๋ฅ˜

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ธํ…”๋ฆฌ์ œ์ด ํ„ฐ๋ฏธ๋„์—์„œ gradlew ๋นŒ๋“œ๋ฅผ ํ•˜๋ ค๋˜ ๋„์ค‘ ์•„๋ž˜์™€ ๊ฐ™์€ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค. Why? ์ €๋Š” ์•„๋ž˜์™€ ๊ฐ™์€ ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•˜์˜€๋Š”๋ฐ์š”, ๊ตฌ๊ธ€๋ง์„ ํ•˜๋‹ค๊ฐ€ ์ฒ˜์Œ์—๋Š” ๊ถŒํ•œ ๋ฌธ์ œ์ธ ์ค„ ์•Œ๊ณ  ๊ถŒํ•œ์„ ๋ฐ”๊ฟ”๋ดค์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ๊ณ„์† ๊ฐ™์€ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค. ๊ทธ๋ž˜์„œ ๋” ๊ตฌ๊ธ€๋ง์„ ํ•ด๋ดค๊ณ , ์ œ๊ฐ€ ๋ฐ”๋ณด๊ฐ™์€ ์‹ค์ˆ˜๋ฅผ ํ•˜๊ณ  ์žˆ์—ˆ์Œ์„ ๊นจ๋‹ฌ์•˜์Šต๋‹ˆ๋‹ค. gradlew build How to solve the problem ๋ฐ”๋กœ ๋ช…๋ น์–ด ์•ž์— ./ ๋ฅผ ๋ถ™์—ฌ์ฃผ์ง€ ์•Š์•˜๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ๐Ÿ˜… ๋ฆฌ๋ˆ…์Šค/๋งฅ๊ณผ ์œˆ๋„์šฐ ๋ช…๋ น์–ด ์‚ฌ์šฉ๋ฒ•์ด ๋‹ค๋ฅด๋‹ˆ ์•„๋ž˜ ๋‚ด์šฉ ์ฐธ๊ณ  ๋ถ€ํƒ๋“œ๋ฆฝ๋‹ˆ๋‹ค. Linux / MacOS ./gradlew Windows .\gradlew https://stackoverflow.com/questions/41700798/gr..

[Springboot] Http Status 415 error ์˜ค๋ฅ˜ (415 Unsupported Media Type)

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. Springboot ๋ฅผ ์‚ฌ์šฉํ•˜๋˜ ๋„์ค‘ Http Status 415 error ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•˜์˜€์Šต๋‹ˆ๋‹ค. 415 Unsupported Media Type Why? ๊ธฐ์กด ์ปจํŠธ๋กค๋Ÿฌ์—์„œ ๋งค๊ฐœ๋ณ€์ˆ˜๋ฅผ ๋ฐ›๊ธฐ ์œ„ํ•ด @RequestParam ์–ด๋…ธํ…Œ์ด์…˜์„ ์‚ฌ์šฉํ–ˆ์Šต๋‹ˆ๋‹ค. ๋งค๊ฐœ๋ณ€์ˆ˜ 5๊ฐœ๋ฅผ ๋ฐ›๊ณ  ์žˆ๋˜ ํ„ฐ๋ผ ์ƒ๋‹นํžˆ ๋ณต์žกํ•ด ๋ณด์—ฌ ํ•ด๋‹น ๋งค๊ฐœ๋ณ€์ˆ˜๋“ค์„ ํ•˜๋‚˜์˜ Dto Req ๊ฐ์ฒด๋กœ ๋ฐ”๊ฟ”์ฃผ์—ˆ์Šต๋‹ˆ๋‹ค. ์ดํ›„ ์ฝ”๋“œ ์‹คํ–‰์„ ํ–ˆ๋Š”๋ฐ, ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค. Springboot ๋ฅผ ์ž˜ ๋ชฐ๋ผ์„œ, ํ•ด๋งธ์ง€๋งŒ ์ €ํฌ์—๊ฒ ๊ตฌ๊ธ€๋‹˜์ด ์žˆ์Šต๋‹ˆ๋‹ค. ๐Ÿคง !! ๊ตฌ๊ธ€๋ง ํ›„, ์ œ๊ฐ€ ์‚ฌ์šฉํ•œ ์–ด๋…ธํ…Œ์ด์…˜์ด ์ž˜๋ชป ๋˜์—ˆ๋‹ค๋Š” ๊ฒƒ์„ ์•Œ๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. @RequestParam ๋Š” ๋‹จ์ผ ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ›๊ธฐ ์œ„ํ•ด์„œ ์‚ฌ์šฉํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์—ฌ๋Ÿฌ ๋งค๊ฐœ๋ณ€์ˆ˜๊ฐ€ ๋“ค์–ด..

[React] Moment.js AM/PM์„ ์˜ค์ „/์˜คํ›„๋กœ ํ‘œ์‹œํ•˜๋Š” ๋ฐฉ๋ฒ•

Intro ์•ˆ๋…•ํ•˜์„ธ์š”. ์ด๋ฒˆ ์‹œ๊ฐ„์—๋Š” Moment.js ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์—์„œ AM/PM๊ฐ€ ์•„๋‹Œ ์˜ค์ „/์˜คํ›„๋กœ ํ‘œ์‹œํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๋„๋ก ํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค. ์ฐธ๊ณ ๋กœ, Moment.js๋Š” ๋‚ ์งœ ๋ฐ ์‹œ๊ฐ„ ๋ฐ์ดํ„ฐ๋ฅผ ์‰ฝ๊ฒŒ ๋‹ค๋ฃฐ ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ฃผ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์ค‘ ํ•˜๋‚˜์ž…๋‹ˆ๋‹ค. How to solve the problem ์ œ ๊ฒฝ์šฐ, ๋‚ ์งœ ๋ฐ์ดํ„ฐ๋ฅผ "์˜คํ›„ 10:00" ๋กœ ํ‘œ์‹œํ•ด์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ "10:00 PM"์œผ๋กœ ๋‚˜์˜ค๋”๊ตฐ์š”. ๊ตฌ๊ธ€๋ง์„ ํ•ด๋ณธ ๊ฒฐ๊ณผ ๋‹ค์Œ์˜ ํ•ด๊ฒฐ์ฑ…์„ ์ฐพ์•˜์Šต๋‹ˆ๋‹ค. ๋ฐ”๋กœ moment/local/ko ๋ฅผ ์ž„ํฌํŠธ ํ•ด์ฃผ๋Š” ๊ฒƒ! import 'moment/locale/ko' ์œ„ ์ฝ”๋“œ๋ฅผ ์ž„ํฌํŠธ ํ•ด์ค€ ์ดํ›„, ํ™”๋ฉด์„ ์‚ดํŽด๋ณด๋‹ˆ 10:00 PM ์ด ์•„๋‹Œ ์˜คํ›„ 10:00 ๋กœ ์ž˜ ํ‘œ์‹œ๊ฐ€ ๋˜๊ณ  ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค.

Framework/React 2023.01.10

[Modern React] section1 : Let's Dive in!

1. How to Get Help pass 2. Join Our Community! done 3. Course Resourse pass 4. Let's Build an App! ์–ด๋–ป๊ฒŒ ๋ฆฌ์•กํŠธ๋ฅผ ๋นจ๋ฆฌ ๋ฐฐ์› ์„๊นŒ๋ผ๋Š” ์งˆ๋ฌธ์„ ๋งŽ์ด ๋ฐ›์Šต๋‹ˆ๋‹ค. ์ด ์งˆ๋ฌธ์— ๋‹ตํ•  ์ˆ˜ ์žˆ๋Š” ๋Œ€๋‹ต์€ ๋”ฑ ํ•œ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค. You have to write code and you have to work on projects 5. Critical Questions 1. What's React All about? ๋ฆฌ์•กํŠธ๋Š” (1) HTML์„ ๋ณด์—ฌ์ฃผ๊ฑฐ๋‚˜ (2) ์‚ฌ์šฉ์ž๊ฐ€ ๋ฌด์–ธ๊ฐ€๋ฅผ ํ•  ๋•Œ, HTML์ด ๋ณ€ํ•œ๋‹ค. 6. A Few More Critical Questions 2. How does a React app start up? 1. All of your p..

Framework/React 2023.01.08

[React] react-datepicker ํŠน์ •/์ง€๋‚œ ๋‚ ์งœ ์ œ์™ธํ•˜๋Š” ๋ฐฉ๋ฒ•

Intro react-datepicker ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•˜๋˜ ๋„์ค‘, ๋๋‚ ์งœ๊ฐ€ ์‹œ์ž‘ ๋‚ ์งœ๋ฅผ ์„ ํƒํ•  ์ˆ˜ ์—†๋„๋ก ๋‚ ์งœ๋ฅผ ์ œ์™ธํ•ด์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค. How to solve the problem ๊ตฌ๊ธ€๋ง ํ›„ ์•„๋ž˜์™€ ๊ฐ™์€ ๋‹ต๋ณ€์„ ์ฐพ์•˜์Šต๋‹ˆ๋‹ค. DatePicker ์†์„ฑ์˜ minDate๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ œ์™ธํ•  ๋‚ ์งœ๋ฅผ ๋„ฃ์–ด์ฃผ๋ฉด ๋ฉ๋‹ˆ๋‹ค. https://stackoverflow.com/questions/50626937/react-datepicker-exclude-past-dates

Framework/React 2023.01.04
๋ฐ˜์‘ํ˜•