#ml

질문 12

해시태그 없이 키워드만 일치하는 질문은 개수에 포함되지 않아요.

개발자 선생님들 도와주세요..

안녕하세요 초보개발자입니다 지금 구글로 코드 복붙하며 게시판 수정중인데 아예 똑같이 복붙 하였는데 저는 왜 이런 식으로 나올까요 도와주세요 .. ㅠㅠ 프로젝트 발표가 코앞인데.. 1번째사진은 작성자의 사진이고 2번째 사진이 제 출력 화면입니다... 코드는 댓글에 적어두겠습니다..도와주세요.. ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8">  <meta name="viewport" content="width=device-width" , inital-scale="1">  <link rel="stylesheet" href="css/bootstrap.css"> <title>JSP 게시판 웹 사이트</title> </head> <body>  <nav class="navbar navbar-default">  <div class="navbar-header">  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-exmaple="false"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>  <a class="navbar-brand" href="main.jsp">JSP 게시판 웹 사이트</a> </div>  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">  <ul class="nav navbar-nav">  <li><a href="main.jsp">메인</a></li>  <li><a href="bbs.jsp">게시판</a></li> </ul>  <ul class="nav navbar-nav navbar-right">  <li class="dropdown">  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">접속하기<span class="caret"></span></a>  <ul class="dropdown-menu">  <li><a href="login.jsp">로그인</a></li> <li class="active"><a href="join.jsp">회원가입</a></li> </ul> </li> </ul> </div>  </nav>  <div class="container"> <div class="col-lg-4"></div>  <div class="col-lg-4"> <div class="jumbotron" style="padding-top: 20px;">  <form method="post" action="joinAction.jsp">  <h3 style="text-align: center;">회원가입 화면</h3> <div class="form-group">  <input type="text" class="form-control" placeholder="아이디" name="userID" maxlength="20"> </div> <div class="form-group"> <input type="password" class="form-control" placeholder="비밀번호" name="userPassword" maxlength="20"> </div>  <div class="form-group"> <input type="text" class="form-control" placeholder="이름" name="userName" maxlength="20"> </div>  <div class="form-group" style="text-align: center;">  <div class="btn-group" data-toggle="buttons">  <label class="btn btn-primary active"> <input type="radio" name="userGender" autocomplete="off" value="남자" checked>남자 </label> <label class="btn btn-primary"> <input type="radio" name="userGender" autocomplete="off" value="여자" checked>여자 </label> </div>  </div>  <div class="form-group">  <input type="email" class="form-control" placeholder="이메일" name="userEmail" maxlength="20"> </div>  <input type="submit" class="btn btn-primary form-control" value="회원가입"> </form> </div> </div> <div class="col-lg-4"></div> </div>  <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>  <script src="js/bootstrap.js"></script> </body> </html>

개발자

#jsp

#java

답변 2

보충이 필요해요 3

일 년 전 · 허니 님의 새로운 답변

(SSR 새로고침 문제)NextJS page에서 redux persist gate 설정하면 Client컴포넌트로 인식되는 문제

NextJS Pages Router에서 유저 데이터를 상태관리하기위해 redux를 사용했으나, 새로고침 시 데이터가 날라가는 문제를 해결하기 위해 persist gate를 사용했습니다. 하지만 redux persist gate를 사용하면 클라이언트 컴포넌트로 인지되는 문제가 있습니다. 궁금한 것 1) persist gate를 잘못써서 생긴 문제일까요? 아님 persist gate를 쓰면 안될까요? 2) 해결 방법으로 생각 해본 것은, "persist gate를 사용하지 않고 매 새로고침 시 저장되어있는 local storage에서 데이터를 새로 가져온다." 입니다. 3) ssr시 상태관리 새로고침 다른 방법으로 해결해본 경험 있으시면 아무렇게나 대답해주시면 감사하겠습니다!!! ----------------------------------------------- 문제의 코드 위치: https://github.com/bbookng/zippyziggy-v2/blob/main/frontend/zippy-ziggy/src/pages/_app.tsx 문제의 코드: import GlobalStyle from '@/styles/Global.style'; import useDarkMode from '@/hooks/useDarkMode'; import { media } from '@/styles/media'; import { darkTheme, lightTheme } from '@/styles/theme'; import type { AppProps } from 'next/app'; import { ThemeProvider, createGlobalStyle } from 'styled-components'; import normalize from 'styled-normalize'; import '@/styles/index.css'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import AppLayout from '@/layout/AppLayout'; import store, { persistor } from '@/core/store'; import { PersistGate } from 'redux-persist/integration/react'; import { Provider } from 'react-redux'; import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; import 'toastify-js/src/toastify.css'; import { ToastContainer } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.css'; import DefaultHead from '@/components/Head/DefaultHead'; import Construction from './construction'; const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, // default: true }, }, }); function App({ Component, pageProps }: AppProps) { const { colorTheme, toggleTheme } = useDarkMode(); return ( <Provider store={store}> <PersistGate persistor={persistor}> <QueryClientProvider client={queryClient}> <ThemeProvider theme={colorTheme === 'dark' ? darkTheme : lightTheme}> <AppLayout toggleTheme={toggleTheme}> <Component {...pageProps} /> ... </AppLayout> </ThemeProvider> <ReactQueryDevtools initialIsOpen={false} /> </QueryClientProvider> </PersistGate> </Provider> ); } export default App;

개발자

#next.js

#persis

#redux

답변 1

9달 전 · 최용빈 님의 답변 업데이트

파이썬 오류 좀 고쳐주세요 ㅠㅠ

import time import requests import streamlit as st API_BASE_URL = "http://localhost:8000/qna" # Fastapi로 api 생성 def request_chat_api(user_message: str) -> str: url = API_BASE_URL resp = requests.post( url, json={ "user_message": user_message, }, ) resp = resp.json() print(resp) return resp["answer"] def init_streamlit(): st.set_page_config(page_title='Dr. KHU', page_icon='🩺') if "messages" not in st.session_state: st.session_state.messages = [{"role": "assistant", "content": "안녕하세요! Dr.seo입니다🩺"}] # Initialize chat history if "messages" not in st.session_state: st.session_state.messages = [] # Display chat messages from history on app rerun for message in st.session_state.messages: with st.chat_message(message["role"]): st.markdown(message["content"]) def chat_main(): if message := st.chat_input(""): # Add user message to chat history st.session_state.messages.append({"role": "user", "content": message}) # Display user message in chat message container with st.chat_message("user"): st.markdown(message) # Display assistant response in chat message container assistant_response = request_chat_api(message) with st.chat_message("assistant"): message_placeholder = st.empty() full_response = "" for lines in assistant_response.split("\n"): for chunk in lines.split(): full_response += chunk + " " time.sleep(0.05) # Add a blinking cursor to simulate typing message_placeholder.markdown(full_response) full_response += "\n" message_placeholder.markdown(full_response) # Add assistant response to chat history st.session_state.messages.append( {"role": "assistant", "content": full_response} ) if __name__ == "__main__": init_streamlit() chat_main() 이 코드를 실행시키면 자꾸 AttributeError: st.session_state has no attribute "messages". Did you forget to initialize it? More info: https://docs.streamlit.io/library/advanced-features/session-state#initialization 라고 뜨네요..

개발자

#파이썬

#python

답변 2

보충이 필요해요 2

Next.js SSR + react-query 조합에서의 serializing 에러

안녕하세요! Next.js SSR + react-query 조합을 사용하려고 하는데요, page 컴포넌트 내 getServerSideProps 함수에서 prefetching을 받아온 후에 serializing 에러가 발생합니다. (Next.js는 13버젼입니다.) 에러 내용은 다음과 같습니다. Error: Error serializing `.dehydratedState.queries[0].state.data.headers` returned from `getServerSideProps` in "/top". Reason: `object` ("[object AxiosHeaders]") cannot be serialized as JSON. Please only return JSON serializable data types. 해당 에러 내용으로 구글링을 해보니, 대부분 getServerSideProps 함수 반환 코드에서 return { props: { dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), }, }; 와 같이 dehydrate(queryClient)값을 JSON화 -> Object화를 하라고 하는데요, 이와 같이 사용해도 또 다시 아래와 같은 에러가 납니다. TypeError: Converting circular structure to JSON --> starting at object with constructor 'ClientRequest' | property 'socket' -> object with constructor 'Socket' --- property '_httpMessage' closes the circle Backend API는 Express.js를 사용하고 있으며, res.status(200).json({ data: ~ })와 같은 방식으로 응답을 주고 있습니다. 어떻게 해결할 수 있을까요? 코드 첨부가 안되네요, 아래는 page 컴포넌트가 위치한 파일의 전체 코드입니다. import type { ReactElement } from 'react'; import { dehydrate, QueryClient, useQuery } from '@tanstack/react-query'; import { format } from 'date-fns'; import TopMusicContainer from '~containers/TopMusicContainer'; import Layout from '~layouts/Layout'; import type { NextPageWithLayout } from '~pages/_app'; import TopMusicService from '~services/topMusicService'; import * as MusicType from '~types/musicType'; export async function getServerSideProps() { const queryClient = new QueryClient(); await queryClient.prefetchQuery(['fetchTopMusic'], () => { const params: MusicType.ListRequestType = { filter: 'title', keyword: '', page: 1, limit: 25, time: format(new Date(), 'yyyyMMddHH'), }; return TopMusicService.list(params); }); return { props: { dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), }, }; } const Top: NextPageWithLayout = (): JSX.Element => { const { data, isLoading } = useQuery({ queryKey: ['fetchTopMusic'], queryFn: () => { const params: MusicType.ListRequestType = { filter: 'title', keyword: '', page: 1, limit: 25, time: format(new Date(), 'yyyyMMddHH'), }; return TopMusicService.list(params); }, }); return ( <section> <TopMusicContainer /> </section> ); }; Top.getLayout = function getLayout(page: ReactElement) { return <Layout>{page}</Layout>; }; export default Top;

개발자

#react

#next.js

#ssr

#react-query

답변 2

추천해요 4

Gmail이 안 보내져요 ㅠㅠ 퇴근하고 싶어요

서버 비용 잇슈로 이관 진행 중에 있습니다. 그런데 이전 서버인 AWS에서는 Gmail이 정상적으로 전송이 됬는데 카페24로 이관을 하고선 Gmail 전송이 안되고 있습니다. 차이는 Nginx를 안사용하다가 사용하게된 차이가 있습니다. 방화벽 인바운드, 아웃바운드 설정을 해줬고요 로그를 확인해 보니 이런 에러만 나오는데 스택오버에서는 같은 질문에 답변이 안 달려 있더라고요 0|npm | [0] info: chet createShowhostChat updateMember {"timestamp":"2023-04-17 18:28:50"} 0|npm | [0] [2023-04-17 09:28:50] DEBUG Sending mail using SMTP/6.8.0[client:6.8.0] 0|npm | [0] 0|npm | [2023-04-17 09:28:50] DEBUG [SDdf79wZJFg] Resolved smtp.gmail.com as 74.125.23.109 [cache hit] 0|npm | [0] [2023-04-17 09:28:50] ERROR [TSzLl35tpQ] Connection timeout 0|npm | [0] 0|npm | [2023-04-17 09:28:50] DEBUG [TSzLl35tpQ] Closing connection to the server using "destroy" 0|npm | [0] 0|npm | [2023-04-17 09:28:50] ERROR Send Error: Connection timeout 소스는 이렇게 구성되어 있습니다. 예상은 SMTP 587 Port가 활성화가 아니구나라고 생각을 했는데 잘 안되더라고요 선배님들 도와주세요 ㅠㅠ 추가 로그 입니다. 0|npm | [0] [2023-04-17 11:51:32] DEBUG Sending mail using SMTP/6.8.0[client:6.8.0] 0|npm | [0] [2023-04-17 11:51:32] DEBUG [4tmiO0CAyPQ] Resolved smtp.gmail.com as 64.233.188.109 [cache hit] 0|npm | [0] POST /showhost/approval/approve - - - - ms 0|npm | [0] 0|npm | info: request url : /root/path/to/custom/error/path/500.html {"timestamp":"2023-04-17 20:52:32"} 0|npm | [0] error: app.js/404 {"timestamp":"2023-04-17 20:52:32"} 0|npm | [0] GET /root/path/to/custom/error/path/500.html 404 9 - 3.101 ms 0|npm | [0] [2023-04-17 11:53:02] ERROR [m98HJ7ZDhGM] Connection timeout 0|npm | [0] [2023-04-17 11:53:02] DEBUG [m98HJ7ZDhGM] Closing connection to the server using "destroy" 0|npm | [0] [2023-04-17 11:53:02] ERROR Send Error: Connection timeout 0|npm | [0] error: app.js/500 {"timestamp":"2023-04-17 20:53:02"} 왜 저에게 이런 시련이 ㅠㅠ 원인조차 모르겠습니다. ㅠㅠ 빨리 해결해 퇴근하고 싶습니다.

개발자

#node

#gmail

#방화벽

#smtp

답변 2

추천해요 1

7달 전 · 백승윤 님의 새로운 답변

서버 운영중에 궁금증이 생겼는데 이 로그는 해킹시도인가요?

django.core.exceptions.DisallowedHost: Invalid HTTP_HOST header: 'pingjs.qq.com'. You may need to add 'pingjs.qq.com' to ALLOWED_HOSTS. 2023-10-03 05:09:32,644 [ERROR] django.security.DisallowedHost: Invalid HTTP_HOST header: 'pingjs.qq.com'. You may need to add 'pingjs.qq.com' to ALLOWED_HOSTS. Traceback (most recent call last): File "/usr/local/lib/python3.9/site-packages/django/core/handlers/exception.py", line 55, in inner response = get_response(request) File "/usr/local/lib/python3.9/site-packages/django/utils/deprecation.py", line 133, in __call__ response = self.process_request(request) File "/usr/local/lib/python3.9/site-packages/django/middleware/common.py", line 48, in process_request host = request.get_host() File "/usr/local/lib/python3.9/site-packages/django/http/request.py", line 167, in get_host raise DisallowedHost(msg) django.core.exceptions.DisallowedHost: Invalid HTTP_HOST header: 'pingjs.qq.com'. You may need to add 'pingjs.qq.com' to ALLOWED_HOSTS. 2023-10-03 05:09:32,646 [WARNING] django.request: Bad Request: /ping.js 2023-10-03 05:09:32,646 [WARNING] django.request: Bad Request: /ping.js 2023-10-03 05:38:50,055 [WARNING] django.request: Not Found: /wp-admin/setup-config.php 2023-10-03 05:38:50,055 [WARNING] django.request: Not Found: /wp-admin/setup-config.php 2023-10-03 05:38:55,464 [WARNING] django.request: Not Found: /wp-admin/install.php 2023-10-03 05:38:55,464 [WARNING] django.request: Not Found: /wp-admin/install.php 2023-10-03 05:39:03,014 [WARNING] django.request: Not Found: /readme.html 2023-10-03 05:39:03,014 [WARNING] django.request: Not Found: /readme.html 2023-10-03 05:39:12,407 [WARNING] django.request: Not Found: /license.txt 로그를 까보면 이런식으로 무언가 요청을 엄청 많이 하더라구요 ?? 방지하는 방법이라던가 혹시 어떻게 대처해야할지 아시는분이 있을까요 ..?

개발자

#django

#nginx

답변 2

추천해요 1

일 년 전 · 고건 님의 새로운 댓글

nginx 관련 질문 있습니다 ㅠㅠ

안녕하세요, 현재 프로그래밍을 공부하고 있는 학생입니다. 공부를 하던 중 django를 사용해 프로젝트를 진행했고 aws, nginx, uwsgi 로 배포를 진행하게 되었는데, 배포는 성공적으로 됐지만 처리해야할 데이터가 많은 기능을 사용하면 자꾸 아래 오류가 뜨더군요. (퍼블릭 ip 주소는 X로 가렸습니다) 2023/11/07 15:14:13 [error] 7487#7487: *1 upstream timed out (110: Unknown error) while reading response header from upstream, client: xx.xxx.xxx.xxx, server: _, request: "POST /file_upload/upload/ HTTP/1.1", upstream: "uwsgi://unix:/home/ubuntu/docusift/uwsgi.sock", host: "xx.xxx.xxx.xx", referrer: "http://xx.xxx.xxx.xx/success_with_token/WeDkQYs84hDYcDsl/" 구글링을 해봐도, 스택오버플로우를 찾아봐도 110 오류가 unknown error로 뜨는 것에 대한 해결책은 나오지 않아서 이렇게 여쭤보게 되었습니다. 다만 구글링을 해본 결과 설정을 따로 만져줘야 한다는 것을 봐서 설정은 아래처럼 해놓은 상태인데, 아직 해결은 되지 않은 상황입니다. [uwsgi] chdir=/home/ubuntu/docusift/blog module=blog.wsgi:application master=True pidfile=/tmp/project-master.pid vacuum=True max-requests=5000 daemonize=/home/ubuntu/docusift/debug_uwsgi.log home=/home/ubuntu/docusift/venv virtualenv=/home/ubuntu/docusift/venv socket=/home/ubuntu/docusift/uwsgi.sock chmod-socket=666 socket-timeout=600 harakiri = 300 http-timeout = 300 server { listen 80 default_server; listen [::]:80 default_server; root /var/www/html; index index.html index.htm index.nginx-debian.html; server_name _; location / { include /etc/nginx/uwsgi_params; uwsgi_pass django; proxy_buffer_size 512k; proxy_buffers 16 512k; proxy_busy_buffers_size 1024k; proxy_connect_timeout 500s; proxy_send_timeout 500s; proxy_read_timeout 500s; send_timeout 500s; } location /static/ { alias /home/ubuntu/docusift/blog/staticfiles/; } http { upstream django { server unix:/home/ubuntu/docusift/uwsgi.sock; } client_max_body_size 100M; proxy_connect_timeout 800s; proxy_send_timeout 800s; proxy_read_timeout 3600; 혹시라도 해결 방법을 아시는 분들 답변 주시면 정말 감사하겠습니다!!!

개발자

#배포

#aws

#ubuntu

#nginx

#uwsgi

답변 1

일 년 전 · 김태현 님의 새로운 댓글

sql문 부적합합니다..

spring boot 4 에서 웹개발프로젝트를 진행중입니다.. jsp페이지에서 받아온 searchText값을 쿼리문으로 비교 후 foodinfolist를 반환해주는데 sql developer에서는 SELECT * FROM foodinfolist WHERE food_name LIKE '%' || '치킨' || '%'; 해당 코드가 정상동작 돼서 잘 검색하지만 mapper.xml에서 <mapper namespace="com.springproj.dietwebservice.repository.IFoodInfoDAO"> <select id="findfoodinfo" parameterType="java.lang.String" resultType="com.springproj.dietwebservice.domain.FoodInfoVO">> <![CDATA[ SELECT * FROM foodinfolist WHERE food_name LIKE '%' || #{searchText} || '%' ]]> </select> </mapper> 해당 코드를 실행하면 sql문이 부적합합니다 라고 에러가 발생합니다.. 뭐가 문제인지 모르겠습니다.. searchText: 치킨 으로 데이터도 잘 담겨오는데.. [2m2024-01-31T16:24:22.500+09:00[0;39m [31mERROR[0;39m [35m8208[0;39m [2m---[0;39m [2m[nio-8090-exec-9][0;39m [2m[0;39m[36mo.a.c.c.C.[.[.[/].[dispatcherServlet] [0;39m [2m:[0;39m Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Request processing failed: org.springframework.jdbc.BadSqlGrammarException: ### Error querying database. Cause: java.sql.SQLSyntaxErrorException: ORA-00900: SQL 문이 부적합합니다 선배님들 조언부탁드립니다..

개발자

#sql

#spring-boot

답변 4

추천해요 1

10달 전 · 프레드윰 님의 새로운 답변

안녕하세요 html,css질문입니다 제발 도와주세요

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>중경삼림</title> <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mb.YTPlayer/3.3.1/jquery.mb.YTPlayer.min.js"></script> <script> jQuery( function() { jQuery( '#background' ).YTPlayer(); } ); </script> <link rel="stylesheet" href="style.css"> </head> <body> <div class="jb-box"> <div id="background" class="player" data-property="{ videoURL:'https://www.youtube.com/watch?v=ncT1R2hMpaQ', mute: true, showControls: false, useOnMobile: true, quality: 'highres', containment: 'self', loop: true, autoPlay: true, stopMovieOnBlur: false, startAt: 9.5, opacity: 1 }"></div> </div> <br><br><br> <div id="director"> <br><br><br><br> <h1>왕가위</h1> </div> </body> </html> 이건 html이고, body{ margin: 0; } .jb-box { position: relative; } #background { z-index: -1; } 이건 외부 css파일입니다. 문제는 저 스크립트가 다른 컴퓨터에서 실행했을 때 영상이 재생되지 않는다는 것입니다. '이 동영상은 볼 수 없습니다'로 뜹니다...혹시 저 스크립트에 문제가 있는 것 일까요..?? 도와주시면 정말 감사하겠습니다...

개발자

#html-css-js

#웹디자인

#css

#html

#script

답변 2

일 년 전 · 이상선 님의 새로운 답변

Async await fetch 오류

const Content: React.FC = () => { const [htmlContent, setHtmlContent] = useState<string>(''); const data = { "filePath": ""https://cdn-image-dev.test.io/dev/contents/terms/2023/10/11/",", "fileName": "test.html" } const url = `${data.filePath}${data.fileName}`; // HTML 파일 가져오기 const fetchHtmlFile = async () => { try { const res = await fetch(url); console.log('res', res); if (res.ok) { const html = await res.text(); setHtmlContent(html); } else { console.error('Failed to fetch HTML file'); } } catch (error) { console.error('Error fetching HTML file:', error); } }; fetchHtmlFile(); return( <div dangerouslySetInnerHTML={{ __html: htmlContent }} /> ) } fetchHtmlFile 호출 시켜 res에서 얻은 html소스를 가져와 htmlContent에 넣어야하는데 에러나네요,, **에러메세지 Content.tsx:30 Error fetching HTML file: TypeError: Failed to fetch Cors 오류 참고 -- api url : https://api-dev.test.io/api/test/v1/~~ 도와주세요!

개발자

#react

#html

#async

#fetch

답변 1

일 년 전 · 이상선 님의 새로운 답변

Lighthouse를 이용한 성능 최적화 - 텍스트 압축 사용

안녕하세요. 개발한 웹 페이지를 lighthouse를 통해 성능 최적화에서 난관을 겪고 1년차 React 개발자입니다. lighthouse에서 추천 항목에 "텍스트 압축 사용"을 적용해보려 시도 중입니다. .htaccess 파일에 다음과 같은 코드를 넣어서 텍스트 압축을 실행하였습니다. <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf </IfModule> 결과적으로 네트워크 탭에서 Content-Encoding: gzip 으로 표시되는 것을 보니까, 텍스트 압축이 되는 것처럼 보입니다. 그런데 lighthouse에서는 성능 점수가 더 올라가지 않고 있습니다. 혹시 "텍스트 압축" 부분에서 최적화 하는 다른 방법이 있을까요? 아니면 제가 놓치고 있는 부분이 있는 걸까요?

개발자

#react

#lighthouse

#front-end

답변 1

2년 전 · 김현진 님의 답변 업데이트

onChange 함수 관련하여

<template v-for="(item, i) in checkListItem" :key="i"> <label for="camera"> <form> <input type="file" id="camera" accept="image/*" style="display: none" @change="e => handleFileInputChange(e, i, item)" /> </form> </label> </template> <script lang=“ts” setup> const handleFileInputChange = (e, i, item) => { console.log(checkListItem.value) //콘솔1 console.log(item) //콘솔2 console.log(i) //콘솔3 const files = e.target.files[0] const reader = new FileReader() reader.onload = e => { /* 수정필요 */ item[i].check_file = e.target.result item[i].checked = true } reader.readAsDataURL(files) } <script> //콘솔1 checkListItem = [ {checkId: 11, content: ‘체크리스트1’}, {checkId: 12, content: ‘체크리스트2’}, {checkId: 13, content: ‘체크리스트3’}, {checkId: 14, content: ‘체크리스트4’}, {checkId: 15, content: ‘체크리스트5’} ] handleFileInputChange 함수 실행 시 선택한 checkListItem의 item과 index값을 가져와 선택한 item에 파일 첨부하고싶은데.. 현재는 체크리스트4번에 파일을 첨부하면 체크리스트1에 값이 들어옵니다. 콘솔 찍어보면 무조건 첫번째 객체값 부터 찍힙니다. //콘솔2 는 {checkId: 11, content: ‘체크리스트1’}, //콘솔3은 0 이 찍힙니다.

개발자

#onchange

#javascript

#vue3

답변 2

일 년 전 · 유택범 님의 답변 업데이트

JSON 데이터 DB 저장

안녕하세요. Java Spring으로 백엔드 서버 마이그레이션, 알람 기능 개발 중에 고민이 있어 질문드립니다. [상황] 기존 알람 서비스는 하나의 서비스 Class로 통합해서 두고, 문자, 푸쉬알람, 이메일 3가지 경우로 기능을 swith하여 각 기능별로 서비스를 호출하는 방식으로 구현되어 있습니다. 알람과 관련된 데이터는 JSON 파일에서 불러와 jsonObejct와 Map 자료구조를 통해 가공하여 기능 구현이 되어있습니다. 알람 데이터 JSON 파일은 상황별 코드에 따라 문자, 푸쉬알람, 이메일로 데이터가 구분되어 있습니다. JSON 파일은 대략적으로 아래와 같은 형태입니다. (mail 알람의 경우엔 HTML 파일을 전송하는 방식입니다. thyemleaf를 통해 전달받은 파라미터 값만 HTML에 주입하는 형태로 구현되어 있어서 msg 안에 String 대신 JSON 형태의 데이터가 들어가고 있습니다.) [알람 JSON 데이터 구조 예시] { "code1" : { "Sms" : { "title" : "sms 제목", "msg" : "sms 메세지", }, "Push" : { "title" : "push alarm 제목", "msg" : "push alarm 메세지", }, "Mail": { "title" : "mail 제목", "msg": { "name" : "#{name}", "use" : "#{use}", ... }, "code2" : {... }, ... } [문제 인지 & 개선 방향 고민] 알람 데이터가 JSON으로 정의되어 있다보니, 기능 개발을 위해 Json 파일을 읽고, JsonObject와 Map 자료구조로 데이터 가공을 할 수 밖에 없는 상황인데요. 제가 알기로는 자바에서 Map 자료구조를 사용하게되면 타입 자체가 불명확해서 지양해야 하며, JSON 파일로 관리 시 하드코딩에 해당되어 기능 자체에 제약이 많다고 판단하여 해당 상황을 DTO로 관리함과 동시에 Database에서 관리하도록 바꿔볼까 생각중입니다. [궁금증 & QnA] 이 상황에서 고민 & 궁금증이 몇 가지 있습니다. 1. 해당 알람 데이터를 DB 관리로 바꾸는게 더 나은 선택인지? -> 만약 바꾼다고 하면 Alarm Table을 따로 두고, User Table과 N:M 매핑하는식으로 구현할 생각입니다. 2. , mail HTML Template이 다양하다보니, Template 마다 넘겨줘야하는 JSON 데이터가 다양한 상황입니다. 그러다보니 mail msg 컬럼에는 다양한 형태의 JSON 데이터가 들어가게 되어 이걸 DB로 구현한다고 하니 막막한 상황입니다. -> 결국 해당 부분만 JSON 데이터로 넣는것 말고는 떠오르는 방법이 없네요.(해당 부분만 JSON 데이터로 넣으면 오히려 관리가 더 어려워지지 않을까 고민입니다.) 3. 다른 분들은 알람 기능을 어떻게 구현하는지 궁금합니다.

개발자

#spring

#database

#json

#fcm

답변 1

display:-webkit-box 왜 적용이 안될까요?

1. p태그에 말줄임css(display:-webkit-box 포함)를 적용했습니다만 적용이 되지 않고 overflow:hidden처리만 되더라구요... display:box 나 display:block를 적용하거나 display속성을 아예 지워버리면 나오는데 webkitbox가 먹히지 않는 이유가 있을까요? (개발자도구에는 찍힙니다) display:flex로 코드를 짜고 있는데 이것도 영향이 있을까요? 2. 그리고 css에서 display: box와 display: block 두 가지의 차이점이 무엇인가요?? html, css구조 같이 올릴게요! -webkit-box 적용이 안되는 이유 알려주세요 html구조 <section> <div> <div> <div> <div> <p></p> <span></span> </div> </div> </div> </div> </section> css구조(scss) @mixin shortening($line, $lineHeight){ overflow: hidden; text-overflow: ellipsis; @if($line == 1){ white-space: nowrap; }@else{ line-height: $lineHeight; max-height :$lineHeight * $line; -webkit-line-clamp: $line; -webkit-box-orient: vertical; display: -webkit-box; } } section { margin-bottom: 160px; div { div { display: flex; justify-content: space-between; div { width: 200px; div { p { margin: 20px 0 10px; font-size: 18px; color: $titleColor; @include shortening(2, 18px); } div { display: flex; justify-content: space-between; align-items: center; p { font-size: $subTextFont; color: #ff4e43; } span { //아이콘 font-size: 20px; color: #efd942; cursor: pointer; } } } } } } }

개발자

#css

#말줄임표

#display속성

답변 1

9달 전 · 김유진 님의 새로운 댓글

리액트에서 superagent를 활용해서 minio에 업로드하는 방법을 알려주세요 😂

제발 도와주세요 ㅜㅜㅜㅜㅜ 몇일동안 오류를 해결하지 못하고 있어요.. .. 리액트 웹에서 모바일 핸드폰으로 웹을 접속했을 경우, input을 통해서 사진을 업로드하거나 촬영한 이미지를 minio에 업로드 하고 싶은데, 아래 부분에서 계속 오류가 발생해서 도움을 요청해요 ㅠㅠ https://min.io/docs/minio/linux/developers/javascript/API.html#presignedPostPolicy 위 문서를 참고해서 코드를 작성했어요! [핸드폰으로 웹 접속 -> 사진 업로드/촬영 -> minio 업로드] 이 순서인데, minio에 이미지가 업로드가 되지 않고 계속 오류를 발생시켜요. superagent를 활용해서 minio에 업로드가 가능하다고, 위 문서를 참고해서 작성을 했는데, 계속 아래 에러 메시지를 전달받고 있어요ㅜㅜ 아래 에러를 게속 반환해요. <Error> <Code>MalformedPOSTRequest</Code> <Message>The body of your POST request is not well-formed multipart/form-data. (The name of the uploaded key is missing)</Message> <BucketName>bucket</BucketName> <Resource>/bucket</Resource> <RequestId>RequestId...</RequestId> <HostId>HostId...</HostId> </Error> f12 개발자 모드 페이로드 전달 데이터 bucket: 데이터 Content-Type: multipart/form-data x-amz-date: 날짜정보 x-amz-algorithm:데이터 x-amz-credential: 데이터 policy: 데이터 x-amz-signature: 데이터 file: (바이너리)

개발자

#react

#superagent

#typescript

답변 1

2년 전 · 커리어리 AI 봇 님의 새로운 답변

크롤링 관련 질문드립니다.

js로 크롤링을 하려고 axios, cheerio 모듈을 이용했습니다. 단순하게 특정 부분 클래스를 따서 로그를 찍어보면 LoadedCheerio { length: 0, options: { xml: false, decodeEntities: true }, _root: <ref *1> LoadedCheerio { '0': Document { parent: null, prev: null, next: null, startIndex: null, endIndex: null, children: [Array], type: 'root', 'x-mode': 'no-quirks' }, length: 1, options: { xml: false, decodeEntities: true }, _root: [Circular *1] }, prevObject: <ref *2> LoadedCheerio { '0': Document { parent: null, prev: null, next: null, startIndex: null, endIndex: null, children: [Array], type: 'root', 'x-mode': 'no-quirks' }, length: 1, options: { xml: false, decodeEntities: true }, _root: [Circular *2] } } 다음과 같이 나옵니다. 질문은 1. 크롤링이 안되는 사이트가 있다면 어떻게 확인할 수 있나요 ? 2. https://m.kinolights.com/title/98065 이 사이트에 크롤링을 연습해보고 싶은데 html 요청시에 추가해줘야 할 헤더값같은게 있을까요 ?

개발자

답변 1

2달 전 · 이상래 님의 새로운 답변

FE 화면 디렉토리 어떤 구조로 생성하나요?

BE 개발자입니다. 어쩌다보니 테스트용 화면을 만들게됬는데 백엔드에서 RESTFull 하게 호출할 수 있게 하고 싶다보니 각 path별 디렉토리에 html을 넣어주다보니 구조가 많이 복잡해지는 감이 있네요. 다른 분들은 어떤 방식으로 구조를 만드시는지 궁금해서 질문드립니다. 1. 방법 각 path에 맞는 디렉토리 생성 - test - page - user - edit.html - item.html - equip.html - status.html - home - account - money.html 2. 기능에 맞는 디렉토리 - page - user.html - home.html - component - user-edit.html - user-item.html - user-equip.html - user-status.html - home-account-money.html

개발자

#frontend

#html

답변 2

보충이 필요해요 1

2년 전 · 커리어리 AI 봇 님의 새로운 답변

HTML div contenteditable=true로 에디터 만드는데

div 태그에서 contenteditable=true를 적용하여 에디터를 만드는데 볼드체와 글꼴색상만 필요합니다~ 근데 볼드체 적용하면 글꼴색상(빨간색)은 적용안되고, 글꼴색상(빨간색)을 적용하면 볼드체는 또 적용안되고.. 즉, 빨간색+볼드체가 동시에 적용이 안되는데, 어떻게 코드를 작성해야 좋을까요 ㅠㅠ 고수님들 답변 부탁드립니다! const btnBold = document.getElementById('btn-bold'); btnBold.addEventListener('click', function () { setStyle('bold'); }); function setStyle(style) { document.execCommand(style); focusEditor(); } function focusEditor() { editor.focus({preventScroll: true}); } const selectFontColor = document.getElementById('select-font-color'); selectFontColor.addEventListener('change', function () { setFontColor(this.value); }); function setFontColor(color) { document.execCommand('foreColor', false, color); focusEditor(); }

개발자

#자바스크립트

답변 1

7달 전 · 아기 개발자 님의 새로운 답변

Yolov8 모델 저장

안녕하세요 Vscode에서 train폴더에서 model = YOLO("yolov8m.pt") # GPU설정 model = model.to(device) model.train(data='data.yaml', epochs=5) torch.save(model.state_dict(), 'yolov8m_trained.pt') 다음과 같이 모델을 학습 시킨후 Predict폴더에서 # 모델 경로와 이미지 경로를 설정합니다. MODEL_PATH = 'yolov8m_trained.pt' # 모델 가중치 파일의 경로를 설정하세요. IMAGE_PATH = 'image.jpg' # 예측을 원하는 이미지 파일의 경로를 설정하세요. # YOLO 모델을 불러옵니다. model = YOLO("yolov8m.pt") model.load_state_dict(torch.load(MODEL_PATH)) model.eval() 이런식으로 모델을 예측하는 용도로만 사용하고 싶은데 자꾸 모델의 구조가 다르다고 오류가 나는데 어떻게 해야할까요? ㅠㅠ

개발자

#python

#yolo

답변 1

추천해요 1

7달 전 · 성지수 님의 새로운 답변

환경변수 주입 및 빌드(모노레포)

모노레포 프로젝트 환경 및 요구사항 - 프로젝트는 front(React), back(Node), common 패키지로 구성되어 있으며, 모노레포로 되어있음 - Dockerfile 스크립트에서는 build → run 순서로 실행되도록 구현되어 있음 - 서버 배포 시에는 하나의 포트만 사용해야 하므로 back(Node)에서 front의 정적 파일(index.html)을 실행해야 함 - Docker 빌드 시, front(webpack 빌드)와 back 둘 다 build 스크립트를 실행하고, 이미지 실행 시에는 back만 run 스크립트를 실행하여 back에서 front의 정적 파일을 실행해야 함 - 환경변수는 이미지 실행 시 docker-compose.yml의 env_file 속성을 사용해 외부에서 주입해야 함(환경변수가 바뀌는 상황이 있다면 .env 파일을 수정한 후 다시 빌드해야 합니다.) 예외 상황 Docker 빌드할 때 .env 파일을 포함하지 않고 run 스크립트를 실행(이미지 실행) 시 주입하는데, front 패키지에는 run 스크립트가 존재하지 않습니다. (back에서 front의 정적 파일을 실행) 즉, 환경변수가 주입되지 않고 있음 해결 방법 첫번째는 back에서 front의 dist 파일 호출 시 환경변수 객체를 만들어 value 값을 key 값으로 치환해서 함께 넘기고, index.html의 head에서 window 객체를 활용해 값을 받는 방법 하지만 이 방법은 개발자 도구에서 환경변수 값이 노출되고, window 객체를 활용하기 때문에 새로운 브라우저를 생성할 때마다 사이드 이펙트가 발생할 수 있음 두번째는 모노레포 root 패키지에서 prerun 스크립트로 front의 build 스크립트를 실행하는 방법 스크립트 -> "prerun": "lerna run build --parallel --scope @projectname/front --stream", 이 방법은 빌드를 두 번 실행하므로 자원을 많이 소모하지만, 예외 상황이 없는 것으로 보임 질문 받은 내용 Q. 환경변수를 바꾸는 상황이 존재할까요? A. 회사의 인프라 환경에 따라 다르지만, 포트나 IP가 변경될 수 있는 상황이 있음 예를 들어, 외부 서버에 요청을 보낼 경우 그 서버의 정보가 바뀌면 설정을 변경해야 하며, 다른 서버에 요청할 때 인증 정보를 입력해야 하는데, 토큰이나 사용자 패스워드 값이 변경될 경우에도 수정이 필요함 고민되는 부분 다른 해결 방법이나 비슷한 상황이 있다면 함께 논의하고 싶습니다. ㅎㅎ *프로젝트 구조 root ├── packages │ ├── back │ │ ├── package.json │ │ ├── index.ts │ │ ├── .babelrc │ │ └── ... │ ├── common │ ├── front │ │ ├── public │ │ │ └── index.html │ │ ├── package.json │ │ ├── src │ │ │ └── index.js │ │ ├── src │ │ ├── webpack.config.js │ │ └── ... ├── package.json ├── lerna.json ├── docker-compose.yml ├── Dockerfile * 프로젝트의 중요 정보는 제외했습니다.

개발자

#환경변수주입

#모노레포

#빌드

#node.js

#react

답변 1

일 년 전 · 손호영 님의 질문

닫힌 질문 | 문제가 뭔지 알려주세요

<!DOCTYPE html>> <html> <head> <title>Love 출석부 로그인</title> <style> h1{ position: absolute; left: 650px; } </style> <script>let name =document.getElementById("samename") alert(name.values+"님 환영합니다.") event.preventDefault();</script> </head> <body> <h1>로그인</h1> <form accept="API.py" method="post" onsubmit="keypress" method="get" action="Love2.html"> 이름:<input type="text" id="samename" size="30" value=""><br> </form> </body></html> 이름을 쓰고 엔터를 누르면 그 다음에 출석부 사이트에 가는데 문제는 엔터를 누르면 crbug/1173575, non-JS module files deprecated.라고 떠요

개발자

#javascript

#백앤드

#html

#css

답변 0

보충이 필요해요 5

NextJS에서 Component 호출 할 때 getServerSideProps 호출 방법이 있나요?

JSTL 이나 Thymeleaf 하다가 NextJS 하려니 많이 해메고 있네요. @,@;;; 우선 시나리오는 ProductList.html 페이지에서 서버로부터 상품 목록 주욱 받아 화면 출력 하는 것 까지는 했어요. 이때 서버 목록은 getServerSideProps 함수에서 받아 처리 했구요. 이제 상품 이름 클릭 했을 때 상세 정보를 Layer 화면으로 띄우려는데 그게 잘 안되네요. Thymeleaf에선 해당 페이지만 빌드 돼 html 형태로 받아 올 수 있었는데 nextjs는 어떻게 해야 하는지 모르겠어요. // 상품 상세 내용 export default function ProductModalLayer({ product }:IProduct) { return (<div> {product.name}</div>); } export async function getServerSideProps(context: any) { // 서버 통신으로 product 상세 정보 전달 const data = ... 생략... return { props: { product: data, }, }; } ------ ProductList 부분에서 상품 이름을 클릭 했을 때 const ModalView = dynamic(() => import("../ProductModal.layer")); // 선언 ... // 화면 그리기 <ModalView seq={prod.productSeq}></ModalView> 이런 형식으로 호출 하니까 getServerSideProps를 호출 하지 않네요. 다른 방법으로 fetch를 이용해 호출 해 봤는데 const res = await fetch("/ProductModal.layer?seq=" + seq); const content = await res.text(); 이렇게 하면 getServerSideProps를 호출 하지만 html Tag가 엄청 붙어 나오고 return 의 결과가 아닙니다. getServerSideProps를 고집 하는 이유는 서버 호출 인터페이스는 꼭 서버에서 이뤄지게 하고 싶어서에요. 브라우져 디버거로 노출 안되게 하고 싶어서. 힌트나 방법좀 부탁 드려요~ 다시 JSTL 이나 Thymeleaf로 돌아 갈 수 없어~~~~

개발자

#nextjs

#react

#ssr

#getserversideprops

답변 1

10달 전 · 익명 님의 새로운 댓글

SpringBoot와 MySQL 도커 배포 과정에서 계속 오류가 발생합니다.

선배님들 안녕하십니까? 제목 그대로 스프링부트와 MySQL 배포 과정에서 HikariPool-1 - Exception during pool initialization. server-1 | server-1 | java.sql.SQLNonTransientConnectionException: Could not create connection to database server. Attempted reconnect 3 times. Giving up. 위와 같은 오류가 발생합니다. MySQL은 정상적으로 배포가 되어서 접근이 가능한 것을 확인했습니다. 하지만, SpringBoot의 경우, 계속 DB와 연결이 실패합니다. 아래는 SpringBoot의 application.properties 파일과 docker-compose.yml 파일입니다. 한 수 가르쳐주셨으면 합니다. 감사합니다. spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver spring.datasource.url=${SPRING_DATASOURCE_URL} spring.datasource.username=${SPRING_DATASOURCE_USERNAME} spring.datasource.password=${SPRING_DATASOURCE_PASSWORD} spring.jpa.show-sql=true spring.jpa.hibernate.ddl-auto=update spring.jpa.properties.hibernate.format_sql=true

개발자

#오류

#스프링부트

#도커

#mysql

답변 1

일 년 전 · 윪 님의 새로운 댓글

html form태그에서 action속성 오류

html 중에서 <form aciton="/signup" method ="POST">이 부분엔서 /signup부분에 하이퍼링크처럼 줄이 생기고 페이지를 로드했을 때 404오류가 뜨는데 혹시 어떤 부분이 잘못되서 그런지 알 수 있을까요..? 그리고 언더바가 생기는 이유도 알고 싶습니다! 구글링을 해도 제가 원하는 답이 없어서 조언 부탁드립니다 ㅜㅜ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <form action="/signup" method="POST"> <div> <label for="id">아이디</label> <input type="text" id="id" name="id" /> </div> <div> <label for="password">패스워드</label> <input type="text" id="password" name="password" /> </div> <div> <button type="submit">회원가입하기</button> </div> </form> </body> </html>

개발자

#html

#form

#frontend

#action

답변 1

일 년 전 · 손우진 님의 새로운 답변

nextauth 를 이용해 springboot 의 jwt를 받아와서 로그인을 구현중입니다.

안녕하세요. nextauth 를 이용해 로그인 구현중입니다. 흔히 생각하는 소셜 로그인이 아닌 username 과 password를 통해 springboot security 에서 jwt를 반환 받아오려고 합니다. // app/api/auth/[...nextauth]/route.ts CredentialsProvider({ name: 'Credentials', credentials: { username: { label: 'Username', type: 'text', placeholder: '아이디' }, password: { label: 'Password', type: 'password' }, }, async authorize(credentials, req) { const res = await fetch(`${process.env.NEXTAUTH_URL}/auth/login`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ username: credentials?.username, password: credentials?.password, }), }); const user = await res.json(); console.log(user); if (user) { return user; } else { return null; } }, }), 그런데 위의 코드처럼 코드를 구성했을때 .env.local 파일의 NEXTAUTH_URL 이 등록이 되면 authorize 가 작동하지 않습니다 . 에러 log라도 있으면 어떻게라도 해보겠는데.. 그것도 없습니다. 그래서 NEXTAUTH_URL 를 등록하지 않고 const res = await fetch(`http://localhost:8080/auth`, 바꾸면 이것역시 에러 log 없이 브라우저상에서 Error 라는 문구만 보여줍니다. 이렇게 생각했을때 authorize는 값을 내부에서만 가져올수 있는거 같은데요. 실제로 가상의 const user = {....} 를 만들어서 반환하면 로그인이 아주 잘 됩니다. 하지만 제가 원하는 방법은 아니죠..ㅍ 검색해보면 prisma 가 많이 나오는데.. 그것 또한 시스템상 제가 원하는 방식이 아닙니다. springboot security 에서 jwt를 받아와서 nextauth에 로그인을 할수 있는 방법은 없을까요? custom login 페이지를 만들어서 해야 할거 같은데 방법을 잘 모르겠습니다. 현재 springboot 서버에 cors 설정이 정상적으로 허용된 상태입니다.

개발자

#nextauth

#springboot

#jwt

#nextjs

#typescript

답변 1

10달 전 · 백승훈 님의 답변 업데이트

프론트엔드 개발자 부트캠프 고민 중 입니다..

안녕하세요 프론트엔드 개발자를 준비하고 있는 1인 입니다. 요번에 운좋게 부트캠프 2개를 붙어서 결정을 해야 하는데 어떤게 더 좋은지 모르겠어서... 질문 남깁니다.. 1. 유데미 웅진씽크빅 풀스택 부트캠프 https://udemy.wjtb.co.kr/event/id/244?utm_medium=paid&utm_source=googleads&utm_campaign=nnt_traffic_bootcamp-KDT_SA&utm_content=id_244&utm_term=240409&gad_source=1&gclid=Cj0KCQjwxeyxBhC7ARIsAC7dS3-3gWAFIN_KxCxPxMz3BPiXaYOnJAtTtj8mtwbt_lJ_lhrhksM5DKwaArdtEALw_wcB 2. 이스트소프트 오르미 프론트엔드 부트캠프 https://estfamily.career.greetinghr.com/o/108906 이렇게 2개를 붙었는데 뭐가 더 좋을까요..? 유데미 웅진씽크빅 풀스택 기술스택 - Html, CSS, Javascript, React.js, Java, Spring, MySQL, AWS 이스트소프트 부트캠프 기술스택 - Html, CSS, Javascript, React.js, Redux, TypeScript, GitHub, Figma 입니다. 둘 다 온라인강의가 기본베이스고 유데미는 오프라인 모임도 진행을 한다고 합니다. 유데미는 신청할 때 프론트엔드 백엔드 풀스택을 고르라고 해서 프론트엔드를 골랐는데 교육과정만 보면 이스트소프트가 맞는거 같은데 어떤걸 선택해야할지 잘 모르곘습니다 ㅠㅠ 도와주세요..

개발자

#부트캠프

#유데미

#오르미

답변 1

스프링 패스변수 질문

@RequestMapping("/member/delete/{id}") public ResponseEntity<String> deleteMember(@RequestParam List<String> id) { int result1=secessionService.deleteSecession(id); int result = memberService.deleteMember(id); HashMap<String, String> map = new HashMap<String, String>(); map.put("count", String.valueOf(result)); if(result != 0) { map.put("message", "데이터 삭제 성공"); }else { map.put("message", "데이터 삭제 실패"); System.out.println(result); } return new ResponseEntity(map,HttpStatus.OK); } 체크박스로 선택한 여러개의 아이디들을 한꺼번에 삭제하려는데 하나만 선택했을 때만 삭제가 되고 있어요 삭제하려는 아이디가 1개가 될수도 10가 될수도 있어 불특정, 유동적입니다 그러려면 RequestMapping부분을 어떻게 고치면 좋을까요??

개발자

#java

#스프링

#spring

#웹개발

답변 2

일 년 전 · 익명 님의 질문

nextjs에서 랜더링 시점 바꾸기

안녕하세요! nextjs 프로젝트 진행중에 궁금증이 생겼습니다. 현재 Sidebar 컴포넌트에서 카카오맵이 불러와져야 작업을 할 수 있는 상태입니다. 카카오 맵은 children 에서 랜더링되기 때문에 아래와 같이 코드작성시, Sidebar 랜더링 시점에 kakao is not defined 라는 오류가 뜹니다. 혹시 Sidebar를 좀 늦게 랜더링 할 수 있을까요? export default function RootLayout({ children, }: { children: React.ReactNode; }) { return ( <html lang="en"> <body className={inter.className}> <div id="login-modal" /> <section className="flex h-screen"> <nav className=" h-full bg-slate-100"> <Sidebar /> </nav> {children} </section> </body> <Script src={`//dapi.kakao.com/v2/maps/sdk.js?appkey=${APIKEY}&libraries=services,clusterer`} strategy="beforeInteractive" /> </html> ); }

개발자

#nextjs

#reactjs

답변 0

일 년 전 · 익명 님의 새로운 댓글

iOS 개발 시, 사용자 개인정보 조회 및 전송 범위에 대한 질문(DevceID/MACAdress/IP)

안녕하세요. iOS 개발하면서 어려움이 있어서 이렇게 질문 남깁니다. Q. iOS 디바이스에서 활동기록을 서버로 전송하고 싶은데, DeviceID 혹은 MAC 주소를 조회해서 서버에 전송하는 행위가 법적이나 애플 약관상 이슈가 없는지 궁금합니다. 제가 검색해보면, Apple 정책은 다음과 같습니다. 링크: https://developer.apple.com/app-store/user-privacy-and-data-use/ "Can I fingerprint or use signals from the device to try to identify the device or a user? No. Per the Apple Developer Program License Agreement, you may not derive data from a device for the purpose of uniquely identifying it. Examples of user or device data include, but are not limited to: properties of a user’s web browser and its configuration, the user’s device and its configuration, the user’s location, or the user’s network connection. Apps that are found to be engaging in this practice, or that reference SDKs (including but not limited to Ad Networks, Attribution services, and Analytics) that are, may be rejected from the App Store." 제가 인지하기론, 디바이스를 특정짓는 정보는 서버에 전송하는 것을 불법으로 알고 있는데, 제가 암묵지로만 알고 있다보니, 정확한 근거를 찾고 싶어서 질문드립니다! 긴글 읽어주셔서 감사합니다!

개발자

#ios

#privacy

#security

#programming

#아이폰

답변 2

일 년 전 · 변재정 님의 새로운 댓글

next.js 특정 페이지에 컴포넌트 미출력 기능 구현 이슈(use client 사용)

로그인페이지(/user-page)에서 footer컴포넌트를 안띄우는 기능을 구현하고 싶어 footer 컴포넌트를 csr 방식으로 사용하도록 'use client' 줬습니다. 근데 error ReferenceError: window is not defined 라는 에러가 뜨면서 적용이 안되네요ㅠㅠ nextjs는 ssr이니까 window에 접근하기 위해선 'use client'를 주면 된다고 들었는데 왜 안되는걸까요?? 찾아보니까 useEffect 쓰라해서 useEffect도 써봤는데 에러가 뜨진않지만 여전히 적용안되더라구요. 문제점 알려주시면 감사하겠습니다ㅠㅠㅠ <footer.tsx 파일> 'use client' import React, { useEffect } from 'react' import style from '../styles/footer.module.scss' const Footer = () => { if (window.location.pathname === '/user-page') return null return ( -생략- ) } <루트 layout.tsx 파일> 'use client' export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( <html lang="ko"> <body className={inter.className}> <div className="wrap bg-white"> <Header /> {children} <Footer /> </div> </body> </html> ) }

개발자

#next.js

답변 3