전체 글68 리엑트 개발 환경 구축 _ Webpack 설치 _ 2 1. webpack, babel 파일생성webpack.config.js 작성const HtmlWebpackPlugin = require('html-webpack-plugin');module.exports = { module: { rules: [{ test: /\.js$/, exclude: /node_modules/, use: { loader: 'babel-loader' }, }, ], }, plugins: [ new HtmlWebpackPlugin({ template: './public/index.html', .. 2024. 12. 2. 리엑트 개발 환경 구축 _ Webpack 설치 _1 1. nodeJs 설치, vscode 설치** cmd 혹은 vscode터미널에서 node -v 와 npm -v 를 검색해 설치 여부와 버젼 확인이 가능하다. 2. packagenpm init -ypackage.json 생성됨 3. React , Babelnpm install react react-dompackage-lock.json 생성됨 npm install --save-dev @babel/core babel-loader @babel/preset-env @babel/preset-reactpackage-lock.json 파일을 보면 babel 추가됨을 알 수 있다. 4. Webpack npm install --save-dev webpack webpack-cli html-webpack-plugi.. 2024. 12. 2. 테이블에 스크롤 추가하기 tbody에 스크롤을 넣기 위해 display 속성을 bolck으로 변경하는걸 봤는데 (** overflow 속성이 display: table에서 작동 안하기 때문에 block으로 변경 ** tbody를 block으로 수정하면 테이블이 틀어짐, 때문에 tr을 display: table로 변경하는데 ** 그렇게 수정하게 되면 colgroup 작동 안함 ) 결과적으로는 테이블 태그로 구조를 짜는 의미가 없어보여서(그렇게 할거 같으면 다른 태그를 쓸거같음..) 테이블구조를 유지하면서 스크롤을 할 수 있는 방법을 찾아보았다. 1. 방법** 테이블을 감싸는 div에 스크롤 기능을 넣는다. ** 스크롤 css로 overflow: auto를 넣고 최대 높이값을 지정한다. (높이값에 도달 전에는 스크롤이 .. 2024. 8. 20. [LWC] onclick 이벤트 일반적인 javaScript 문법 onclick='함수명(this)' Select All RED BLACK BLUE See the Pen checkbox_all_check_02 by gaae (@gaae) on CodePen. salesforce js문법 onclick={함수명} this 로 클릭한 요소를 반환할 수 있는데.. salesforce는 방법을 모르겠다.. html Select All RED BLACK BLUE jsdom 호출시에도 this.template 로 호출한다. import { LightningElement } from 'lwc';export default class Bmc_srm_test extends .. 2024. 7. 10. [JavaScript] Cannot read properties of null 로컬에서 잘 되던 JavaScript가 lwc에서 에러가 났다... 에러 : Cannot read properties of null (reading 'classList') 찾아보니 우선순위의 문제라고 한다. *** 해결방법 const visualActive = document.querySelector('.visual'); 에서 const visualActive = document.documentElement.querySelector('.visual'); document.documentElement = 최상위 html을 가리킨다.좀더 명확?하게 dom을 호출 할 수있게 된다. 2024. 7. 4. [LWC] 공통css , 공통 js , 공통 이미지 생성 및 연동 1. static resources - 화면 왼쪽상단에 톱니바퀴 클릭 - setup - Custom Code - static resources 검색 - 오른쪽 화면 New 버튼을 클릭해 범용적으로 사용 가능한 이미지나 css, js 를 저장 할 수 있다.** css, js는 처음 한번만 파일을 올리면 vscode로 받아서 수정및 반영 할 수 있다.**vscode안에서 css (한쌍인 resources -meta.xml)를 생성하고 deploy를 하는 방법도 있지만, 여러사람이 동시에 작업하는 환경에서는 폴더를 덮는 위험한 상황이 발생할 수있으므로(salesforce는 소스 코드 버전을 관리가 되지 않아 형상관리가 되지 않는다.) 권장하지 않는다. 2. 파일올리기 - new 클릭 - 이름은 파일명과 .. 2024. 7. 3. 이전 1 2 3 4 5 ··· 12 다음