목록분류 전체보기 (101)
wintertreey 님의 블로그
초반 세팅 # 2. 로컬 저장소 초기화 git init # 3. 변경 사항 스테이징 git add . # 4. 커밋 생성 git commit -m "Initial commit" # 5. 원격 저장소 추가 git remote add origin https://github.com/username/repository.git # 6. 브랜치 설정 (optional, 만약 main 브랜치를 기본 브랜치로 사용한다면) git branch -M main # 7. 변경 사항 푸시 git push -u origin main 추가 업로드시 $ git add . $ git commit -m "---" $ git push origin main https://blog.naver.com/comma_dev/223530523026 ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/d70DN0/btsINZksybq/oaMDADD9RIOeoXxpgP02H0/img.png)
css 넣는법 3import React, {useState, useEffect} from 'react';import '../App.css'export default function HookTest2(){ //key: 'value' 형식의 json데이터 let st = {color: 'skyblue', textAlign: 'center'} return( {/* 이 부분이 css가 적용된것 */} 리액트의 이해 ECMA에 대한 선행학습필요 CSS 적용방식에 대한 이해 );} 전체적으로 태그에 className을 주어 css효과를 준다..App { padding-left:..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/quDVM/btsIOTQ7XOi/tX8CPS9i3f32yB6vk6YNu1/img.png)
아직 익숙하지 않은 관계로 cmd창의 명령문까지도 기입하고자한다. 프로젝트 새로 생성 폴더닫기 폴더열기 자 그럼 실습을 해보자! 클래스 컴포넌트 import React, { Component } from "react";class App extends Component { state = { count:0 }; countUpdate(n){ this.setState({count:n}); } render(){ const {count} = this.state; // const나 let으로 변수 설정 return( class 컴포넌트 사용 number : {count} { this.countUpdate(coun..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/wiO1g/btsIQviUT5s/h9B0v7KYltCb0QgleXz4G0/img.png)
jsx란? JSX(Javascript Syntax eXtension)는 Javascript를 확장한 문법이다. JSX는 리액트로 프로젝트를 개발할 때 사용되므로 공식적인 자바스크립트 문법은 아니다. 브라우저에서 실행하기 전에 바벨을 사용하여 일반 자바스크립트 형태의 코드로 변환된다. jsx 문법 - 반드시 부모 요소 하나가 감싸는 형태여야 한다. function App() { return ( Hello Hi );}이것처럼 각각의 형태로 적으면 에러가 난다. function App() { return ( Hello Hi );} 모든걸 한데 모아서 처럼 빈 태그로라도 감싸주어야한다. - 자바스크립트 표현식JSX 안에서도 자바스크립트 표현식을 사용할 수 있다. 자바스크립트 표현식을 작성..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/H6DBk/btsINaF1yKQ/knDPzUKBsGC1jBOUHxphIK/img.png)
리액트 React란?사용자 인터페이스(UI) 개발에 초점을 맞춘 프론트엔드 라이브러리.복잡하고 동적인 웹 페이지 개발 시 사용이 용이하여, 실시간 대시보드, 소셜 미디어 애플리케이션, 전자상거래 플랫폼 개발에 많이 사용되는 프론트엔드 개발도구. ‘프론트엔드 개발자가 많이 사용하는 도구 2위’에 기록될 만큼 프론트엔드 개발자들이 선호하는 개발도구로, 활발한 커뮤니티의 존재, 다양한 라이브러리나 프레임워크와 호환이 가능, 컴포넌트 기반의 아키텍처 제공 등의 장점을 가져 UI 개발을 쉽게 도와주는 프론트엔드의 대표적인 라이브러리로 뽑히고 있습니다. 리액트 등장 배경웹 개발이 복잡해짐에 따라 html, css, js만으로는 한계가 생겼으며, 초기에는 Web 개발을 위한 프론트엔드 라이브러리로 DOM조작을 쉽게해..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bE5Fhn/btsIR2fnKo2/igF1QdKbqxyO6cMIVcls2k/img.png)
Git Bash로 작업공간에서 업로드시 에러가 났다. fatal : unable to access 하얀색이 내 정보, 노란색이 구사용자정보. 자리를 옮기고 나서 깃배시연동시 에러문구가 떴다. 전사용자의 깃허브 계정정보가 남아있어서 거부되었던것. 편집버튼을 눌러 수정하면 된다. https://breakcoding.tistory.com/61 [GitHub] 깃허브 fatal: unable to access, push 안 됨학교 연구실 PC에서 작업하던 것을 집에서도 이어서 하고 싶어서 집에 와서 내 노트북에 내 레파지토리를 clone해왔다. 그러고 나서 코드를 수정하고 add와 commit까지는 잘 했다. 그런데 push가 안 되breakcoding.tistory.com
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/txab0/btsIG2nKmz8/But0ymRofRFMp1vnkkFBJk/img.png)
db작업create table springboard( num int primary key, author varchar(10) not null, title varchar(30) not null, content text, bwrite datetime default now(), readcnt int default 0); 프로젝트 생성 프로젝트 세팅application.propertiesspring.application.name=sprweb17mybatis_miniboardserver.port=80spring.thymeleaf.cache=false#mariadb server connectspring.datasource.driver-class-name=org.mariadb.jdbc.Driverspring.d..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/emAMg4/btsIF0vqici/C9S86TfQ01Ha5JhoGpaq0k/img.png)
세팅작업 properties build 체크. build 고쳤을경우 build> refresh 필! package pack.model;import jakarta.persistence.Column;import jakarta.persistence.Entity;import jakarta.persistence.Id;import jakarta.persistence.Table;import lombok.Data;@Data@Entity@Table(name="sangdata")public class Sangpum { @Id private int code; @Column(nullable = false) private String sang; private int su; private int dan; // 변수 ff..