개발에 대한 두서 없는 이야기

{"series":[{"name":"Desktops","data":[10,41,35,51,49,62,69,91,148]}],"chart":{"height":350,"type":"line","zoom":{"enabled":false}},"dataLabels":{"enabled":false},"stroke":{"curve":"straight"},"title":{"text":"Product Trends by Month","align":"left"},"grid":{"row":{"colors":["#f3f3f3","transparent"],"opacity":0.5}},"xaxis":{"categories":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep"]}} {"..

개인적으로는 reactive를 많이 쓰게 될것 같다. 처음 vue3를 접했을 땐 ref로 템플릿에서 선언된 dom에 접근하는 용도로 많이 사용했고, 그렇게 명시하면 바로 스크립트 단에서는 this.$refs.test 템플릿에서는 $refs.test로 접근할 수 있어 편했다. 그러나 vue3로 오면서 해당 방법처럼 접근하려면 템플릿에서도 ref="test" 스크립트 단에서도 setup()에서 const test=ref(false); return에서 test를 리턴해줘야만 사용할 수 있어 중간과정이 늘어 불편하고 어려웠다. 그렇다고 reactive를 쓰기엔 react는 obejct형태이고 test.tt 형식으로 접근하고 선언해야해 앞부분 접미사가 늘어나는게 불편했다. vue3 좀 더 알아보니 reactive..

실제로 IE을 고려하며 개발을 시작하는 경우는 없겠지만 이미 IE까지 고려하여 개발된 사이트들은 무수히 널려있고, 이러한 사이트도 꾸준히 유지보수를 해야하며, 이러한 사이트는 이미 IE라는 악마에 걸려있기에, 꾸준히 IE의 지원도 고려해야한다. IE의 난관은 크게 두가지가 있는데, 모던 브라우저에서 동작되지 않는 문법, 함수, 또는 IE만 존재하는 변수, 같은걸 사용했어도 달리 출력하는 등..(이 부분은 IE만의 문제는 아니다) 보통 스크립트 구조내에서 babel을 때려박으면 대부분 해결되는 일이다. 다만 IE자체가 워낙 오래된 브라우저다 보니 엔진 자체가 구려서, 사이트가 다루는 데이터량이 방대할때 이 속도를 해결할 수 없는경우가 많다. 대부분 큰 테이블 데이터를 다루거나, 차트같은 라이브러리를 활용할..

자바스크립트에는 변수 선언 방법이 3가지 있다. var, const, let var은 자바스크립트의 시작부터 존재하던 함수 선언이지만 해당 변수가 가장 복잡한 면이 있기에 추후에 가장 나중에 설명하도록 하겠다. const temp = "hi" temp = "hi" //불가능 const dom = document.getElementById("test") //id:test라는 엘리먼트가 html에 그려져있는 경우 dom.innerHTML = 'hi' //가능 dom = document.getElementById('temp'); //불가능. functoin 우선 const의 특징이다. const는 한번 선언하면 재사용, 재선언 할 수 없으며 해당 함수도 사용이 불가능하다. 다만 자바스크립트의 특징. 개같음은 ..

vue2에서 cretated(), mounted(), computed() 등의 라이프싸이클은 setup에서 모두 포함시켜 활용 할 수 있다. 특정한 변수에만 해당 라이프 싸이클을 입력하는것이 vue2와 달라진 큰 차이점이라 볼 수 있겠다. 아래는 타입스크립트에서 ref객체를 사용하는 예제이다. 버튼 import { defineComponent, ref} from 'vue'; export default defineComponent({ name : 'View_Comment', props : { bo_table:String, wr_id:String }, setup(props) { //props, 상위 객체가 있을시 props로 값을 받을 수 있다. const bo_table = props.bo_table; c..

vue2와 vue3는 많은 변경점이 있었지만 아마도 가장 와닿는 변화는 스크립트단의 라이프싸이클일것이다. beforeCreated, created가 setup으로 대체되었으며 data에서 선언하던것도 대부분 setup으로 넘어가 data를 쓸일이 거의 없어졌다. 현재 vue3에서도 created나 data는 활용 가능하지만, 권장하는 방법이 아니기에.. vue2의 경우 {{text}} export defalut { data() { return { text : "1", } } created() { console.log(this.text) //1이 찍힘 } } 으로 활용한다. vue3의 경우 vue2에 비하면 상당히 번거로워졌다. {{data.text}} import { reactive } from "vue..

TOAST UI Editor. 그리고 두개의 괜찮은 차트 라이브러리를 삽입하여 완성하였다. 웹호스팅에서 curl로 file_get_contents를 대체하였으며 아래의 소스 라이브러리는 전 글과 같다. { "chart": { "type": "line" }, "series": [{ "name": "sales", "data": [30,40,35,50,49,60,70,91,125] }], "xaxis": { "categories": [1991,1992,1993,1994,1995,1996,1997, 1998,1999] } } ```apexchart { "chart": { "type": "line" }, "series": [{ "name": "sales", "data": [30,40,35,50,49,60,70,9..

혼돈의 중위권에서 잘 버텨내는 KT 개인적인 취미생활과 생업, 부업 등 여러가지 조건으로 글쓰기가 귀찮아져서 안썼다가 다시 쓰기 시작한다. 단, 1월 17일자 경기 기록은 기록에 문제가 있어 반영되지 않았다. 본론으로 바로 들어가서, KT는 개인적으로 생각보다 잘하고 있는지 못하고 있는지 잘 모르겠다. 2021-01-17일자 기록 논란이 많긴 하지만 MVP가드인 허훈 선수가 현재 기량이 최정상급에 올라와있고, 수비에서 많은 지적을 받긴하나 공격에서는 상당한 효율로 리그내 최고의 3&D?라고 볼 수 있는 양홍석 선수까지 괜찮은 국내선수들이 몇 있고, 두명의 용병도 현재 어느정도 제 몫을 해주고 있다. cnt TWOP TWOPA % THREEP THREEPA % FT FTA veryelary 398 109 ..

TOAST UI Editor. 그리고 두개의 괜찮은 차트 라이브러리를 삽입하여 완성하였다. 그리고 이 에디터 UI는 급조하여서 사용하기 마냥 쉬운 상태는 아니지만, 매번 빌드하기도 귀찮고 개인 사이트에 업로드해서 해당 부분에서 글을 쓸 예정이지만 웹호스팅 계정에서는 file_get_contetns가 활용이 안된다. 다른 웹서버를 구하면 배포까지 할 예정이다. 다음은 사용중인 차트들의 예제이며 사용하는 방법이다. { "chart": { "type": "line" }, "series": [{ "name": "sales", "data": [30,40,35,50,49,60,70,91,125] }], "xaxis": { "categories": [1991,1992,1993,1994,1995,1996,1997, 1..

interface view { t1 : string test?:{ count?:number } } const v:view = { t1 : "hello, typesciprt", } 로 하면 추후 api나 함수 실행으로 값이 변경되어 test 값에 들어간것을 읽을때 에러가 난다. let v:view = { t1 : "hello, typesciprt", test :{ count : 0 } } ?로 선언했더라도 하위 배열이나 오브젝트가 있으면 초기값을 선언해줘야 제대로 읽을 수 있다. 버그인지 아닌진 모르지만 관련 문제가 발생했을때 이렇게 해결했다.