본문 바로가기



전체  > 전체 글 (54)

NextJs 03: NextJs서버 배포버전 빌드 안녕하세요. 각성한 데브키라입니다.  웹 개발 과정에서 개발 버전과 배포 버전의 차이는 사용자 경험과 웹사이트 성능에 직접적인 영향을 미칩니다. 개발 버전은 주로 개발자가 코드를 작성하고 테스트하는 과정에서 사용되며, 여러 디버깅 정보와 추가적인 리소스가 포함되어 있어 파일 크기가 큽니다. 반면, 배포 버전은 사용자에게 제공되는 최종 제품으로, 최적화를 통해 파일 크기를 줄이고 로딩 시간을 단축시키는 것이 중요합니다.배포버전 빌드의 중요성개발용 소스버전에서는 네트워크 리소스가 6.2MB를 차지하는 반면, 최적화된 배포용 서버 빌드는 단 330KB로 크게 줄어듭니다. 이 차이는 사용자가 웹사이트에 접속할 때 빠른 로딩 시간을 제공하고, 서버 부하를 줄이는 데 결정적인 역할을 합니다. 따라서, 개발 과정이 ..


NextJs 02: NextJs프로젝트 불필요한 파일제거 안녕하세요. 각성한 데브키라입니다. Next.js를 처음 설치하면, 실제 프로젝트에서 사용하지 않을 수 있는 여러 샘플 파일들이 포함되어 있습니다. 이러한 불필요한 내용들을 제거하여 프로젝트를 깔끔하게 정리한 뒤, 최적화된 상태로 Next.js를 시작하는 방법을 알아보겠습니다.[ layout.js 원본 ]import { Inter } from "next/font/google";import "./globals.css";const inter = Inter({ subsets: ["latin"] });export const metadata = { title: "Create Next App", description: "Generated by create next app",};export default func..


NextJs 01 : NextJs로 시작하는 웹 개발: 설치부터 브라우저 실행까지 안녕하세요. 각성한 데브키라입니다. "NodeJs와 NextJs의 세계에 첫 발을 디디는 여러분을 환영합니다! 이 가이드는 NodeJs 설치부터 NextJs 프로젝트 생성, 그리고 브라우저에서의 실행까지, 초보자도 쉽게 따라 할 수 있는 단계별 안내를 제공합니다. 프로그래밍 여정의 첫걸음을 떼는 이 순간이 설레는 경험이 되기를 바랍니다. 시작해볼까요?"1. NodeJs설치https://devkira.alphonse.kr/5[NodeJs 02: 노드JS를 시작하기 위한 설치와 환경설정안녕하세요, 데브키라입니다. NodeJs에 입문하시려는 분들을 위해 설치부터 설정까지 간편한 가이드를 제공해드려요. NodeJs를 설치하고 기본적인 설정 방법부터 시작해, 간단한 예제 코드를 실행devkira.alphonse...


git: VSCode gitHub연동 안녕하세요. 각성한 데브키라입니다. GitHub를 통해 프로젝트 관리를 시작하는 방법에 대한 가이드입니다. 프로젝트를 처음으로 GitHub에 업로드하는 과정은 복잡해 보일 수 있지만, 몇 단계를 따라 하면 쉽게 할 수 있습니다. 본 가이드는 Git, Visual Studio Code(VSCode), 그리고 GitHub 계정 설정부터 시작해, 최종적으로 GitHub에 프로젝트를 푸시하는 과정까지를 단계별로 설명합니다. 또한, 로그인 정보를 매번 입력하지 않아도 되는 자동 인증 설정 방법에 대해서도 다룹니다.[ 최초 프로젝트 gitHub에 업로드 ]1. 깃허브 다운로드 https://git-scm.com/ Git git-scm.comgit설치 완료 후 아무 폴더에서나 우클릭을 해보면 git관련 메뉴가 추가된..


개발자의 숨겨둔 수행비서 텔레그램 봇을 소개합니다. 안녕하세요. 각성한 데브키라입니다. 텔레그램 봇을 만드는 방법에 대해 알아보는 시간을 가져볼까 합니다. 오늘은 특히 텔레그램 봇을 이용하여 채팅창에 입력한 내용을 외부에서 JSON 형식으로 확인하는 방법을 소개하고자 합니다. 이 과정을 통해, 여러분은 텔레그램 봇과 외부 프로그램을 어떻게 연동할 수 있는지에 대해 배울 수 있을 것입니다. 시작하기에 앞서, 간단한 준비 단계를 거치게 될 텐데요, 이 포스팅은 바로 그 과정을 단계별로 안내하는 내용을 담고 있습니다.  텔레그램 PC버전 다운로드https://desktop.telegram.org/?setln=ko 텔레그램 데스크톱컴퓨터에서 빠르고 끊킴없는 텔레그램을 경험해보세요.desktop.telegram.org1. 처음 접속화면입니다. 2. botfathe..


NodeJs: 기초부터 고급까지 실무 적용 완벽 가이드 안녕하세요. 각성한 데브키라입니다. 이 시리즈는 Node.js의 기본부터 고급 기술까지 단계별로 다룹니다. 서버 실행, 페이지 라우팅부터 nginx 연동, SSL 설정까지 실무 적용을 목표로 합니다. Node.js의 모든 것을 배워보세요. [ NodeJs시리즈 1 ]Node.js의 기초부터 심화까지, 서버 구축의 모든 것을 단계별로 배워보는 시리즈에 오신 것을 환영합니다. 이 시리즈를 통해 Node.js를 활용한 서버 실행, 페이지 라우팅, 백엔드 로직 구현 등을 마스터할 수 있습니다.Nodejs ex01: NodeJs서버실행 후 첫 화면 출력  Nodejs ex02: EXPRESS 및 EJS설정  Nodejs ex03 ex04: Router를 사용한 페이지 출력  Nodejs ex05: 라우터 컨트롤러..


Nodejs ex09: 쿠키 암호화 예제 안녕하세요. 각성한 데브키라입니다. ex08에서 쿠키를 설정하고 메인페이지 접속 시 팝업창을 더 이상 뜨지 않도록 제어하는 예제를  포스팅했었는데 내용을 이어서 쿠키암호화 설정을 해보겠습니다. 수정내역ex09 포스팅에서는 바뀐 부분 2줄에 대한 내용만 추가로 포스팅하겠습니다.아래 작성된 내용 중 {[ 변경 ] app.js, [ 변경 controller/cookie/cookie_ctrl.js ] }의 소스코드에서 화살표로 표시된 부분{app.js 1줄, cookie_ctrl.js 1줄}2줄만 수정하시면 됩니다. [기존 : app.js ] const express = require("express")const cookieRouter = require("./src/routes/cookie/cookie_rout..


Nodejs ex08: 쿠키를 이용한 팝업창 특정시간 뜨지 않도록 설정하는 예제 안녕하세요. 각성한 데브키라입니다. Nodejs에서 쿠키를 이용해서 메인페이지 접속 시 공지사항 팝업청을 특정시간 동안 띄우지 않도록 설정하는 예제입니다.예제에서는 편의상 짧은 시간 10초 동안 띄우지 않도록 설정해서 테스트를 진행하였습니다. [ app.js ]const express = require("express")const cookieRouter = require("./src/routes/cookie/cookie_router")const cookieParser = require("cookie-parser")const app = express()app.set("views", "./src/views")app.set("view engine", "ejs")app.use( cookieParser() )ap..