전체 글

1. CSS란?Cascading Style Sheet : 스타일 보관파일이라고 이해하시면 쉽습니다 자세한 설명은 해당 링크 참고 https://developer.mozilla.org/ko/docs/Learn/CSS/First_steps/What_is_CSS  CSS 란 무엇인가? - Web 개발 학습하기 | MDNCSS (Cascading Style Sheets) 를 사용하면 멋진 웹 페이지를 만들 수 있지만, 어떻게 작동할까요? 이 기사에서는 간단한 구문 예제를 통해 CSS가 무엇인지 설명하고 CSS에 대한 몇 가지 주요 용어를 다룹developer.mozilla.org  1. 파일 만들고 첨부하는 방법(비전공자, 초보도 이해 가능)(Visual Studio code 에디터 : https://code..

1. 프로젝트 생성 node.js설치 (설치되어있다면 생략하시면 됩니다, 하단링크 들어가셔서 LTS 다운로드 후 실행) https://nodejs.org/en frontend 폴더 생성 visual studio code 프로그램 실행후 frontend 폴더 열기 TERMINAL에 npm init vite 입력 후 프로젝트 이름은 ./(현재 폴더에 생성) 치고 엔터 y 입력 후 framework는 React, variant는 JavaScript 선택 2. 프로젝트 구조 2.1 구조 설명 components : 여러 component에서 공통 사용되는 components 생성 항상 component 이름은 대문자로 시작 NotAuthRoutes.jsx : 로그인 된 사람이 로그인페이지나 회원가입 페이지 못들..

1. 프로젝트 구조 - 세부구조 더보기 실제 적용 이미지 components > NotAuthRoutes.jsx // 로그인된 사람이 로그인 페이지나 회원가입 페이지 못들어가게, 만약 들어간다면 메인 페이지로 리다이렉트 시켜주는 라우트 components > ProtectedRoutes.jsx // 로그인 안 된 사람이 로그인 된 사람만 들어갈 수 있는 경로로 들어갔을때 로그인 페이지로 이동시켜줄 수 있게 하는 컴포넌트 // 함수형 컴포넌트로 만들것임 Navbar > Sections // Navbar 안에서만 사용하는 컴포넌트 // Navbar에서도 사용하고 Footer에서도 사용하면 components 폴더 안에 생성 2. 사용 모듈(초기 세팅) Node.js 설치(LTS) Vite 설치 npm ini..

top // ec2-user 로그인 후 입력 (파일별 권한 확인) ps -ef | grep http // apache 권한 확인 Node.js 파일 상태 체크 - pm2 status tail ~/.pm2/logs/index-out.log tail -f ~/.pm2/logs/index-out.log 여기서 ~/. 는 루트를 나타냄

접속 방법 ssh -i name.pem ec2-user@x.xx.xx.xx name = pem 이름 x.xx.xx.xx = 해당 aws ip cd 를 통해 pem 키가 있는 경로에 들어가주셔야 됩니다

[package.json] { "dependencies": { "ejs": "^3.1.9", "express": "^4.18.2", "sequelize": "^6.31.1", "sqlite3": "^5.1.6" } } [index.js] var express = require('express'); var app = express(); let comments = []; //data 저장 (임시 db) const { Sequelize, DataTypes } = require('sequelize'); const sequelize = new Sequelize('sqlite::memory:'); const User = sequelize.define('User', { // Model attributes are de..

https://babycoder05.tistory.com/entry/Vue3-Cli%EB%A1%9C-%EC%83%9D%EC%84%B1%EB%90%9C-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-multi-word-component-names-%EC%98%A4%EB%A5%98-%ED%95%B4%EA%B2%B0

공식 문서 참고!! Download Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more. getbootstrap.com 1. 설치 yarn add bootstrap@5.2.3 yarn이 에러가 덜 난다 원하는 버전 설치 2. main.js에 추가 import 'bootstrap' import 'bootstrap/dist/css/bootstrap.min.css' 3. 오류나는 경우 Module not found: Error: Can't resolve '@popperjs/core' (이런 오류..