본문 바로가기

분류 전체보기

 (274)
hash와 history MPA multi-page application (1) link tag() 클릭 (2) href 속성attribute값인 리소스의 경로가 URL의 path에 추가 (3) 브라우저의 주소창에 path값 표시 (4) 해당 리소스를 서버에 요청 => 클라이언트에서 1~4를 거쳐서 요청을 보내면 서버 측에서 완전한 리소스를 html형태로 응답한다. 또한 브라우저 측에서는 이 html을 받아서 렌더링한다. 이전 페이지에서 새로 받아온 페이지로 전환하는 방식, 즉 전체 페이지를 다시 렌더링하는 방식 따라서 새로고침이 발생하고 히스토리가 남는다.(=뒤로가기 사용가능) 하지만, 매번 클라이언트의 요청에 새로 데이터를 받아와서 다시 렌더링 해야되므로 중복된 자원들에 대한 퍼포먼스 측면에서 손해가 있음 => 이를 보완하기..
Vue CLI Manually select features Choose Vue Version Babel : ES5 이후 버전으로 코딩하면 ES5문법으로 자동변환해 줌 TypeScript Progressive Web App (PWA) Supports : 웹앱 개발 지원 Router : Vue-Router Vuex : 상태관리 CSS Pre-processors : CSS전처리기 SASS SCSS LESS Stylus 등 Linter/Formatter : 자바스크립트 코딩 표준 가이드 Unit Testing : 단위 테스트 플러그인 Mocha 등 E2E Testing : End to End 테스트, 통합테스트 플러그인 https://cli.vuejs.org/guide/creating-a-project.html Creatin..
sample Sample Vue Dummy Sample App Bring Dummy Data {{dummy.id}} {{dummy.title}} {{dummy.userId}} {{content.id}}{{content.title}} × {{content.body}} Close new Vue({ el: '#app', data() { return { dummies: [], content: {} } }, methods: { getData() { axios.get('https://jsonplaceholder.typicode.com/posts') .then(res => { this.dummies = res.data }) .catch(err => { alert(`error: ${err.message}`) }) }, getDet..
Dummy JSON Data https://jsonplaceholder.typicode.com/ JSONPlaceholder - Free Fake REST API {JSON} Placeholder Free fake API for testing and prototyping. Powered by JSON Server + LowDB As of Dec 2020, serving ~1.8 billion requests each month. jsonplaceholder.typicode.com http://teamaqua.github.io/JSONTest/ JSON Test by teamaqua JSON Test.com JSON Test.com is a testing platform for programs utilizing JavaScript O..
Transform http://tcpschool.com/css/css3_transform_2Dtransform 코딩교육 티씨피스쿨 4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등 tcpschool.com 2D 속성 값 설명 none 변형 속성을 적용하지 않음 matrix(n,n,n,n,n,n) translate, scale, rotate, skew 각 속성을 한꺼번에 적용할 수 있는 매트릭스 함수 translate(x,y) 요소의 위치를 옮기는 속성 scale(x,y) 요소의 크기를 비율에 맞춰 확대/축소하는 속성 rotate(angle) 요소를 지정된 각도 만큼 회전시키는 속성 skew (x-angle, y-angle) 요소를 지정된 각도만큼 모양을 비스듬히 변형시키는 속성 3..
@RunWith, @Before import안될 때 // assertThat junit4가 아닌 버전을 사용해서 그런다. testImplementation("org.junit.vintage:junit-vintage-engine") { exclude group: "org.hamcrest", module: "hamcrest-core" } Junit4 > vintage-engine Junit5 > jupiter-engine junit4 -> junit5 @BeforeClass -> @BeforeAll @Before -> @BeforeEach 로 변경되었다. import static org.assertj.core.api.Assertions.assertThat;
생성자 public 클래스명(매개변수){ this.변수 = 매개변수 } 생성자는 new 연산자로 인스턴스 생성할 때 제일 먼저 실행되는 일종의 메소드 같은 녀석? 인스턴스 변수(필드 값 등)를 초기화 시키는 역할을 한다. 생성자의 특징 클래스(Class) 이름과 메소드(Method) 이름이 똑같다. 반환되는 리턴 타입이 없다.
텍스트 말줄임 ... 한줄 말 줄이기... display:block; overflow:hidden; text-overflow:ellipse; white-space:nowrap; //ellipse는 ... 효과를 만들어 주고 nowrap은 줄바꿈이 안되게 해준다 여러줄 말 줄이기... overflow:hidden; text-oveflow:ellipse; 까지는 똑같지만 크롬계열 브라우저에서는 display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:줄 수; IE를 위해서는 max-height값을 설정해준다. 값은 line-height X 줄수 table에 적용한 예시 12345678910111213141516171819202122232425262728293031..

티스토리툴바