반응형

React.js 5

[CI4] 코드이그나이터4 with React.js lib연동

여러모로 해봤는데, 버그가 너무 많습니다. 기본적으로 깔려야하는 게 없어서... 그냥 npx create-react-app으로 하나의 폴더를 만들고 써야할 lib가 적힌 package.json을 ci4\package.json과 npx로 만든 react.js와 동일하게 세팅해주세요. npm i 하여 node_modules를 만듭니다. 그렇게 다운로드한 폴더를 해당 폴더를 이전 글에 적어두었던 위치로 node_modules 파일을 대체합니다. 그리고 명령어 쳐서 재빌드! webpack --config webpack.config.js --stats-error-details test는 리액트 폴더에서 하고 완성된 것을 그냥 ci4폴더로 이동 시키는게 제일 오류가 적어요.

취업/CodeIgniter 2022.01.20

[ci4] ci4 with react.js codeigniter4에 React.js 올리기

++ 기본적으로 php에 대한 이해와 react.js에 대한 이해가 필요합니다 ++ 기존에는 php도 쓰고 ci4도 쓰는바람에 여러가지 짬뽕을 php카테고리에 밀어넣었는데, 이제 ci 폴더를 따로 만들었다. 방법은 진짜 간단하다. 1. bitnami를 설치. 2. ci4를 다운로드 3. c:\bitnami\wamp package 버전\apache2\htdocs\ 해당 ci4압축 해제한 파일 넣어주기. 4. env 파일 복사 후 .env 만들고 production을 주석처리하고, 해당 변수를 복사하여 development로 선언한다. #-------------------------------------------------------------------- # ENVIRONMENT #------------..

취업/CodeIgniter 2022.01.19

[Next]동적 라우팅 방식

Next.js는 이전 포스티에도 언급했듯이 라우팅을 폴더 경로에 따라서 페이징을 처리한다. 그렇다면 id값 같은 동적인 부분은 어떻게 해야할까? 바로 해당 페이지.js나 jsx의 이름을 []로 감싸는 것. /pages ㄴ index.js /news ㄴindex.js /id ㄴ[newsDetail].js 위처럼 하면 고정값이 아닌 동적 라우팅이 진행되어 id값에따라 해당 값을 호출하고 준다. 이때 Router값에 따라 해당 데이터를 호출해야하는데, 이를 어떻게 해야 하나 싶을것이다. import { useRouter } from 'next/router'; // React 내장이 아닌 Next팀이 만든 내장 hook function newsId () { const router = useRouter(); ro..

코딩/Next.js 2021.12.19

css, scss, styled-component 현업에서 사용할때 느낀 점.

Styled-component import React from 'react'; import styled from 'styled-components'; import Button from './components/Button'; const AppBlock = styled.div` width: 512px; margin: 0 auto; margin-top: 4rem; border: 1px solid black; padding: 1rem; `; function App() { return ( BUTTON ); } SCSS import React from 'react'; import './Button.scss'; function Button({ children }) { return {children}; } expor..

728x90