본문 바로가기

분류 전체보기

(16)

[Jenkins][React+TypeScript] eslint가 배포 빌드에 영향을 미치는 점.. 프론트엔드 개발환경 세팅할때 다들 자동설정되는 eslint 파일.. 아시죠..?현재 제가 하고 있는 프로젝트는 Jenkins로 배포가 되어 있는 상황이라 브랜치로 push 하면 바로 빌드가 되어 배포 사이트에서 확인이 가능한데요,, 오늘 글은 제가 한 eslint 설정과 이것이 배포환경에 미치는 영향을 알아보도록 하겠습니다.. 우선 저는 eslint.config.js 파일을 다음과 같이 작성했습니다import js from '@eslint/js';import globals from 'globals';import reactHooks from 'eslint-plugin-react-hooks';import reactRefresh from 'eslint-plugin-react-refresh';import tse..

[Vue.js] 프론트엔드 프로젝트 성능 측정 01 - 💡Lighthouse 성능 측정을 진행하며 작성한 기록용 글입니다.정보 요약은 게시글 하단에서 확인 가능합니다. 안녕하세용!하나의 프로젝트가 끝나면 해야할 것이 있습니다..바로바로...성능 측정!저는 지난 프로젝트에서 프론트엔드를 맡아서 했기 때문에 프론트엔드 성능 측정을 진행해보겠습니다.지난 프로젝트에 대한 간단한 설명글은 - 프로젝트 명세서 및 주" data-og-description="안녕하세요!제가 Django + Vue.js 로 AI API 기반 도서 추천 및 실시간 모임(채팅) 서비스 앱을 개발하였습니다..일단 메인 페이지부터.. 개발 기간은 2025.12.19 ~ 2025.12.26까지 총 일주일로 진행이 되었는" data-og-host="devbyzero.tistory.com" data-og-source-url..

[Django + Vue.js] 1. AI API 기반 도서 추천 및 실시간 모임 서비스 앱 <BOOKLUV> - 프로젝트 명세서 및 주요 서비스 설명 안녕하세요!제가 Django + Vue.js 로 AI API 기반 도서 추천 및 실시간 모임(채팅) 서비스 앱을 개발하였습니다..일단 메인 페이지부터.. 개발 기간은 2025.12.19 ~ 2025.12.26까지 총 일주일로 진행이 되었는데, (물론 이 글을 작성하는 오늘까지 에러 및 미흡한 구현을 수정하였습니다.. 고치려고 한다면 끝도 없음 ^^)짧은 기간이었지만 처음으로 나름의 성과를 만들어낸 플젝이라 생각하여 글로 기록합니다. 잔말 말고 바로 들어가기에 앞서.. 프로젝트 기획 배경 짧게 설명같이 수업듣는 친구들끼리 교환독서(책 한권으로 서로 나눠 읽으면서 책에 간단한 메모 남기며 읽고 교류하는 독서)를 하게 되었는데, 독서 모임을 좀 더 가볍고 쉽게 가질 수 없을까? 란 생각이 들었습니다.오프라인에..

마우스 비추합니다. 한성컴퓨터 vm100 v2 이녀석이 요즘 제 근심걱정이 되엇습니다.쓴 지 반년도 안되었는데 연결 이슈로 10분에 한번씩 마우스 내리치면서 씁니다.. 결국 다른 마우스 샀음.이 글을 보신 분들은 싼 값에 사지 마시고 돈 더 주고 더 좋은 제품 사시길..그리고 충전할때 왜 전원 켜놓고 충전해야하는지 아직도 이해할 수가 없음 충전할때 마음이 너무 불편함

CORS (Cross-Origin Resource Sharing) 1. CORS?Cross-Origin Resource Sharing을 번역하면 '교차 출처 리소스 공유' 출처(Origin)를 공유(Sharing)한다 = 프로토콜·도메인(호스트 이름)·포트 를 공유한다 (단순히 도메인만 공유하는게 아님) 프로토콜, 도메인, 포트 중 하나만 달라도 CORS 에러 발생!CORS를 설정한다는건 출처가 달라도 해당 서비스 간의 리소스를 공유한다는 것임 2. Access-Control-Allow-Origin 세팅하기서버에서는 Access-Control-Allow-Origin 헤더를 설정할 수 있는데, 이걸 명시하면 해당 출처의 요청을 수락함 예를 들면,' Access-Control-Allow-Origin' : | *==> 모든 출처를 허용함 (보안에 취약)' Access-..

좋은 코드란 무엇일까 + 요즘 생각.. 혼자 적어보는 고찰... (생각 정리용) 🙂지금까지 내가 알고 있는 좋은 코드란.. (수준 낮습니다^^) 개발자의 입장에서 좋은 코드는1. 직관적인 코드 >> 코드를 보고 쉽게 이해할 수 있고, 다른 개발자들이 보았을 때 이해 가능 + 수정도 수월하게 가능해야 하고, 일단 복잡해보이는 코드는 거부감이 들기 때문에 직관적으로 쭈욱- 읽을 수 있는? 그런 코드가 좋다고 생각. 2. 메모리량을 줄일 수 있는 짧은 코드>> 불필요하게 메모리를 사용하는 코드는 No..... 회사에서 코드를 쓸 때 신경써야 하는 포인트 중 하나라고 들었다. 3. 수정이 용이한 코드>> 파일과 폴더들을 잘 나누어서 작성된 코드 특히, 리액트 프레임워크를 사용하여 프론트엔드 코드를 쓸 때에는 폴더 파일 구분을 ..

[Html5/CSS3] 웹 홈페이지 상단 네비바(header) 만들기 네비바는 카테고리 글자에 마우스 호버 시 font-weight를 더 두껍게 주었고,네비바로 들어갈 수 있는 페이지는로고(해당 메인화면), 홈 (해당 메인화면), 지역, 테마, 축제, 랜덤 Pick!, 프로필 아이콘으로다른 페이지로 넘어가는 html은 5개이다. (로고와 홈은 다시 돌아가기 위해 만들었음) 학원 과제로 만들었는데React가 아닌 html과 css, javascript로만 개발해야 하는 거라 모든 파일에 상단 네비 헤더와 하단 푸터를 복붙해야했고..그래서 처음 틀을 잡을 때 제대로 잡아서 수정사항을 절대!! 만들지 않아야 겠다고 다짐하고 시작했다.다행히 네비바라서(?) 링크 수정 말고 css는 한번에 만들었다..ㅎ - Html 이런 구조로 갔다.네비바는 ul 태그 안 li로 나열해서 만..

[Python] 도서관리 프로그램 * 콘솔을 이용한 도서관리 프로그램 콘솔 기능으로는1. 도서 등록 (도서 번호, 책 이름 ,책 저자, 출판사) 2. 도서 목록 3. 도서 검색 (제목, 저자, 출판사) 4. 도서 삭제 (해당 도서 번호로 삭제) 5. 프로그램 종료을 넣었다. 콘솔창에 값을 입력받기 위해서 작성한 코드는 1. while 문으로 먼저 콘솔창에 도서관리 메뉴가 뜨게 한다.2. 해당 메뉴의 번호를 입력받아 (int(input))3. if문으로 번호에 해당하는 기능을 넣는다. 번호마다 간단한 설명을 하자면, 1번. 도서 등록 > 도서의 정보를 입력받기 때문에 도서번호, 책 이름, 책 저자, 출판사 총 4개를 입력받는다.2번. 도서 목록> 1번에서 입력받은 도서 정보들을 보여준다. 3번. 도서 검색> 3을 입력값으로 받으면, 콘솔..

이전 1 2 다음

티스토리툴바