체인의정석

Uncaught TypeError: $(…).modal is not a function 개발 도중 다음과 같은 에러가 발생하여 modal이 작동하지 않았다. 이 에러의 경우 jquery를 include에서 한번 빼서 썼으나 한번 더 써서 나온 에러로 jquery를 없애고 나니 오류가 해결되었다. jquery를 이처럼 2번 정의하면 오류가 발생하니 유의하는것이 좋을 것 같다. IT 유튜브 타임해커 보러가기 www.youtube.com/channel/UCHsRy47P2KlE749oAAjb0Yg?view_as=subscriber 타임해커 -블록체인/인공지능 -웹개발(프론트/백) -광고(페이스북/구글/네이버) -사업계획서 작성 -비전공생을 위한 IT 공부법 채널이름은 기획,마케팅,개발을 다 같이해서 업무성과를 ..

다음과 같이 데이터베이스에는 REG_ID,와 REG_TIME, MOD_ID와 MOD_TIME 이 있다. 시간 같은 경우는 현재 시간을 기록하게 기본 값으로 설정해두면 알아서 업데이트가 된다. 다만 REG_ID나 MOD_ID같은 경우에는 session에 있는 ID를 가져오면 된다. Vue 같은 경우는 Vuex안에 들어있는 Store의 storage에서 가져오면 된다. REG_ID와 TIME은 데이터베이스 생성 CREATE 구문을 실행할때 쿼리문에서 같이 넣어주는 것이며, MOD_ID와 TIME은 데이터베이스의 변경 UPDATE 구문을 실행할 때 쿼리문에서 같이 넣어주는 것이다. 한마디로 프로그램 자체에 영향을 주지는 않지만 누가 언제 데이터를 만들고 누가 언제 데이터를 변경했는지를 비즈니스 로직적으로 기록..

1. vue에서는 dom을 쓰지 않는다. vue.js 는 익스텐션 툴을 써서 값을 받아온다. 확장도구에서 Vue dev tools를 써서 받아온다. 받아올 경우 아래와 같이 확장 아이콘이 표시 된다. 2. vue에서 바인딩 된 데이터를 다음과 같이 불러올 수 있다. 현재 electron 앱을 개발중인데 electron의 경우에는 앱이 실행되는 주소를 브라우져에서 띄워서 그대로 보면 된다. 3. vuex를 통하여 로그인 체크하는 state를 만든 후 id와 패스워드 가져오기 vuex - 다음과 같이 필요한 변수들을 state에 정의를 미리 해둔 후 , mutation을 정의하여 state를 변화시킬 값들을 정한다. 마지막으로 actions에서는 정의한 mutation을 이용하여 commit을 하게 되는데 ..

1단계 Vue Cli 사용 2단계 Vuetify의 기본 템플릿 중 googlekeep 버전을 사용하여 기본구조를 잡았다. 3단계 사이드 바에 있는 요소들을 바인딩 한 후 router-link를 통하여 라우팅 시켰다. {{ item.text }} 다음과 같이 링크를 데이터로 바인딩 시킨 후 파라미터로 넘겨 받아서 해당 링크로 이동시킨다. item-text나 icon 부분도 데이터를 바인딩 시켜서 사이드바를 그려준다. 해당 예제는 googlekeep기본 템플릿에 적용되어 있는 예제이다. items: [ { icon: 'mdi-chart-histogram', text: 'Monitoring', path: 'home'}, { divider: true }, { heading: 'Token Manage' }, { ..

아래와 같이 표시될 경우 /user/foo 와 /user/bar 같은 url은 모두 같은 경로에 매핑됩니다. 동적 세그먼트는 콜론 : 으로 표시됩니다. 라우트가 일치하면 동적 세그먼트의 값은 모든 컴포넌트에서 this.$route.params로 인식하게 됩니다. foo가 들어오면 this.$route.params은 foo가 되는 것입니다. const User = { template: 'User' } const router = new VueRouter({ routes: [ // 동적 세그먼트는 콜론으로 시작합니다. { path: '/user/:id', component: User } ] }) 따라서 다음과 같이 사용자의 id를 표시할 수 있습니다. const User = { template: 'User {..

막상 프로젝트를 시작하려니 필요한 모듈들이 생각보다 되게 많았다. 여기에 정리해서 하나하나 써가면서 익혀보도록 하겠다. 일단 express+node.js에 익숙한 상황이기 때문에 거기에 맞춰서 이해하면서 정리해 보았다. 1. Vue cli Vue Cli는 간단하게 프로젝트를 만들어 줄 수 있는 프레임워크다. express와 비슷한 개념인것 같다. https://cli.vuejs.org/guide/creating-a-project.html#vue-create Creating a Project | Vue CLI Creating a Project vue create To create a new project, run: WARNING If you are on Windows using Git Bash with m..

cors란 교차도메인에 대해서 보안을 높이기위해 클라이언트에서 다른 도메인에 있는 데이터를 변경시키는 것을 막는 규약을 말한다. 이에 따라서 공식적이지 않은 외부 API를 가져왔을 때 문제가 생기게 된다. https://velog.io/@wlsdud2194/cors CORS에 대한 간단한 고찰 이 포스트에서는 CORS에 대한 이슈에 대해서 다뤄볼려고 합니다. 웹 개발을 하다보면 한번쯤 겪게되는 이슈로 클라이언트와 서버의 오리진이 다를 때 발생하는 이슈입니다. 🤔 CORS? 크로스 도메� velog.io 이에 대한 해결방안은 다음과 같다. 1. npm 모듈 중 cors 모듈 설치하여 사용 이를 설치하여 사용하게 되면 api 사용을 허가해주는 구문을 더 쉽게 넣을 수 있다. 이를 이용하여 외부 api를 가져..

서버는 기본적으로 컴퓨터안에서 작동하는 시스템이다. 한 컴퓨터안에 다른 포트로 여러 서버를 띄울 수도 있고 여러 컴퓨터에서 나누어서 띄울수도 있다. 소규모 프로젝트가 아닌 대규모 프로젝트에서는 여러 서버를 나누어서 두고 심지어 웹서버와 was를 여러개 띄우기도 한다. 흔히 public에 있는 이미지, pdf 등등 정적인 파일 및 cdn으로 가져오는 부분들은 webserver이다. WAS의 경우에는 node.js에서 작동하는 라우팅하고 api를 만들고 받아오고 하는 부분이다. 정적파일을 제외한 부분이 이에 해당된다. 마지막으로 DB서버의 경우에는 데이터베이스가 있는 컴퓨터이다. 서버가 여러개 있을 경우 각각 포트를 다르게 사용할 수 있다. 나의 경우에는 node.js와 express만 사용하여 개발을하다가..