코딩하렴

DataGrip 사용중 Table이 안보인다..?

으렴 — Mon, 18 Jan 2021 00:34:08 +0900

데이터 그립 잘 사용하고 있는 도중 인스턴스 하나 연결했더니 안보인다

일단 Properties로 가서 해당 Data Source누른다음에 schemas로 가서 걍 저거 체크해주면 끝.

갑작스러워서 당황스러워따

공지같은거없는데

으렴 — Mon, 18 Jan 2021 00:09:10 +0900

맨땅이니까 하나 써둬야지 ^_^

ㅈㅏ주사용하는 prettier option

으렴 — Wed, 5 Feb 2020 14:39:40 +0900

```

"prettier.arrowParens": "always",

"prettier.semi": false,

"prettier.trailingComma": "all",

"prettier.printWidth": 100,

"prettier.singleQuote": true,

```

git blog jekyll theme 추천

으렴 — Sun, 22 Sep 2019 20:55:56 +0900

대부분 라이센스 MIT

■ moon

https://github.com/TaylanTatli/Moon

TaylanTatli/Moon

Moon is a minimal, one column jekyll theme. Contribute to TaylanTatli/Moon development by creating an account on GitHub.

github.com

■ whiteglass

https://yous.github.io/whiteglass/

whiteglass theme

Minimal, responsive Jekyll theme for hackers.

yous.github.io

■ Type-on-Strap

https://sylhare.github.io/Type-on-Strap/

Type on Strap

A website with blog posts and pages

sylhare.github.io

■ thinkspace

https://github.com/heiswayi/thinkspace

heiswayi/thinkspace

Just another minimalist Jekyll theme which designed for technical writing blog. - heiswayi/thinkspace

github.com

■ lanyon

https://github.com/poole/lanyon

poole/lanyon

A content-first, sliding sidebar theme for Jekyll. - poole/lanyon

github.com

■ hyde

https://github.com/poole/hyde

poole/hyde

A brazen two-column theme for Jekyll. Contribute to poole/hyde development by creating an account on GitHub.

github.com

■■■

spring boot로 jsp 사용하여 만들기

으렴 — Wed, 18 Sep 2019 16:33:45 +0900

		<!-- jsp 지원 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>

		<dependency>
			<groupId>org.apache.tomcat.embed</groupId>
			<artifactId>tomcat-embed-jasper</artifactId>
			<scope>provided</scope>
		</dependency>

src/main/webapp/WEB-INF/views

index.jsp 생성

spring.mvc.view.prefix=/WEB-INF/views/
spring.mvc.view.suffix=.jsp

어플리케이션프로퍼티스

<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8"%>
<%@ page import="java.util.*, java.text.*"%>

<head>
  <title>메인 페이지</title>
</head>

<body>
  <%=new Date()%>
  <h2>Hello World</h2>
  
  <a href="t1">링크</a>
</body>

저거 누르면 boot에서 제공하는 404

package com.example.pack01;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

//@RestController
//public class Apple {
//
////  @RequestMapping("/")
////  public String root() {
////    System.out.println("방법1 Apple Call");
////    return "Apple Call";
////  }
//
//	@ResponseBody
//	@RequestMapping("/")
//	public String root() {
//		System.out.println("방법2 Apple Call");
//		return "Apple Call";
//	}
//
//	
//	
//	
//	
//}

@Controller
public class Apple {
  @RequestMapping("/")
  public String f1() { // 함수 이름을 확 바꾸었다.
    System.out.println("곧 index.jsp 실행");
    return "index";
  }
  
  @RequestMapping("/t2")
  public String f2() { // 함수 이름을 확 바꾸었다.
    System.out.println("나는 t2");
    return "t2";
  }
}

안까먹을라고 쓰는 git blog만들깅 +jekyll 리얼걍 메모

으렴 — Tue, 17 Sep 2019 13:37:31 +0900

1. Ruby devkit 설치

https://rubyinstaller.org/downloads/

Downloads

Which version to download? If you don’t know what version to install and you’re getting started with Ruby, we recommend you use Ruby+Devkit 2.6.X (x64) installer. It provides the biggest number of compatible gems and installs MSYS2-Devkit alongside Ruby, s

rubyinstaller.org

알아서 두게 놔두고 도스창 나오면 엔터 착실하게 쳐주면 됨

2. git repository정하기

[자기 아이디].github.io

위의 양식을 지킨다.

gem install bundler jekyll

하고뭐... 다운이나하셈

그러고

http://jekyllthemes.org/

Jekyll Themes

jekyllthemes.org

이런 곳 가가지고 뭐 다운 받을지 고른담엥 clone하거나 fork하면됨쓰

뭔가 어케하는지 대강은알겠는데 글은또 못쓰겠다;;

jekyll serve

뭐.. 할튼 경로나 잡아주고

거기서 하라는대로 하면 대강 나름대로 되긴한다

로컬서버로 키면서 바꾸면 어떻게 돌아가는지 알게됨시 함해보길..

redux관련 library memo

으렴 — Thu, 29 Aug 2019 12:22:04 +0900

 yarn add redux react-redux immutable redux-actions redux-pender axios react-router-dom --save

1. redux 상태관리 ex. bindActioncreators

2. react-redux 리액트 컴포넌트에서 리덕스를 더욱 간편하게 사용할 수 있다. ex. connect, provider

3. redux-actions redux사용시 간편하게 ex. createAction, handelActions

4. redux-pender 프로미스 기반 액션들을 관리하기 위한 미들웨어&도구 포함.

특히 action생성과 reducer에서의 처리과정이 간소화 된다.

5. immutable state를 업데이트 할때에는 state의 불변성을 유지시켜주면서 업데이트 시켜줘야 한다.

기존객체를 건들이지 않고 새객체를 생성해줘가며 해야하기 때문에 복잡하게 되는데 immutable을 사용하게 되면 간편하게 사용할 수 있다.

다만 immutable 내부의 규칙을 지켜주어야 한다. state의 구조가 조금 복잡할때 효과적이다.

react.js 시작하기 190814 - Link 활용하기

으렴 — Wed, 14 Aug 2019 15:13:10 +0900

import { BrowserRouter, Route, Link } from 'react-router-dom'

link? 타이핑을 대신해준다?

 <Link1 to='/'></Link1>

클릭하면 그 url과 enter를 같이 쳐준다

<Link1 to='/gpp'></Link1>

<Link to='/'>home</Link><br/>
<Link to='/fpp/?name=ryeom&age=100'> tiger/name</Link>

이렇게하면 gpp를 대신 걍 눌러줌 타이핑 대용으로 쓴다. enter 필요없이!

저거 딱 누르면 저렇게 만들어준당~

여기서

react.js 시작하기 190814 - Route 활용하기

으렴 — Wed, 14 Aug 2019 14:53:11 +0900

react-router-dom query-string 설치

yarn add react-router-dom query-string --save

App.js 가셈 Root.js로바꾸셈

import { BrowserRouter } from 'react-router-dom'

이렇게하면 browserRouter 사용가능

그 밑에 App.js만드셈 함수형컴포넌트로

class Root extends Component {
  render() {
    return (
      <div>
        <h1>Root.js</h1>
        <BrowserRouter>
          <App/>
        </BrowserRouter>
      </div>
    );
  }
}

function App(props) {
  return (
    <div>
      <h2>App.js</h2>
    </div>
  );
}

function Bpp(props) {
  return (
    <div>
      <h2>Bpp.js</h2>
    </div>
  );
}

이제부터 App는 route장비입니다 장비이름은 <App/>

물논 Bpp도 마찬가지

import React, { Component } from 'react';
import { BrowserRouter, Route } from 'react-router-dom'

//BrowserRouter, Switch, Route 
class Root extends Component {
  render() {
    return (
      <div>
        <h1>Root.js</h1>
        <BrowserRouter>
        <Route path='/app' component={App} />
        <Route path='/bpp' component={Bpp} />
        <Route path='/cpp' component={Cpp} />
          
        </BrowserRouter>
      </div>
    );
  }
}

function App(props) {
  return (
    <div>
      <h2>App.js</h2>
    </div>
  );
}

function Bpp(props) {
  return (
    <div>
      <h2>Bpp.js</h2>
    </div>
  );
}

function Cpp(props) {
  return (
    <div>
      <h2>Cpp.js</h2>
    </div>
  );
}

export default Root

route를 할때 외부에서 코드로 어떻게 받지 ? 라고 생각해야댐

<Route exact path='/app' component={App} />

exact : 딱 그주소와 정확하게 맞을때만 가져오게 된다.

/app/cpp ..

기본 컴포넌트 뒤에 전달하고 싶은 인수로 사용하고 싶을 경우.

<Route exact path='/sub/:pm' component={Dpp}/>

function Dpp({match}) {
  console.log(match)//params에 있음
  return (
    <div>
      <h2>Dpp.js</h2>
      <h3>{match.params.pm}</h3>
    </div>
  );
}

pm으로 부르면 불러진당

location을 사용해보자

<Route exact path='/epp' component={Epp}/>

/epp?name=ryeom 이렇게 들어왔을때

function Epp({location}) {
  console.log(location);
  console.log(location.search);
  const m = qs.parse(location.search)
  console.log(m);
  return (
    <div>
      <h2>Epp.js</h2>
    </div>
  );
}

요래요래 찍힌다.

/fpp?name=ryeom&age=20

만약 이렇게 값이 두개날라온다면?

응똑같음

만약에

/fpp/?name=ryoem&&age=200 요래 같이온다면?

function Fpp({match,location}) {
  console.log(match)
  console.log(location);
  console.log(location.search);
  const m = qs.parse(location.search)
  console.log(m);
  return (
    <div>
      <h2>Fpp.js</h2>
    </div>
  );
}

둘다 받아주면됨

react.js 시작하기 190813 - sass 사용해보기

으렴 — Tue, 13 Aug 2019 11:04:16 +0900

css 할라고

 npm install node-sass
 npm install open-color
 npm install sass-loader
 npm install classname
 
 
 npm install node-sass open-color sass-loader classnames --save
 //군데군데 쓰임

index.css를 .scss로 바꾸기

~의 의미?

install을 시키면 lib가 node_module에 전부 들어간다.

open-color가 node에다가 자동으로 들어간다

index.scss

@import '~open-color/open-color';

body {
  background: $oc-gray-1;
  margin: 0px;
}

main가서 h1태그 걸어라

a.scss파일 만들기

.Redbox{
    background : red;
    padding : 1rem;
}

.greenyellowbox{
    background : greenyellow;
    padding : 1rem;
}

App.js

import React from 'react';
import logo from './logo.svg';
import './App.css';
import './a.scss'
function App() {
  return (
    <div className="App">
      <h2>app.js</h2>
      <Bpp/>
    </div>
  );
}

function Bpp(props) {
  return (
    <div className={'Redbox'}>
      <h3>bpp</h3>
    </div>
  );
}

export default App;

className에 {}이렇게 하면 css와 scss와 호환이 됨

일케된다 마

근디 함더해보자 다른방법으로

import React from 'react';
import './index.scss';
import a from './a.scss'
import className from 'classnames/bind'
function App() {
  return (
    <div className="App">
      <h2>app.js</h2>
      <Bpp/>
      <Cpp/>
    </div>
  );
}
//import './a.scss' 얘랑 짝지
function Bpp(props) {
  return (
    <div className={'Redbox'}>
      <h3>bpp</h3>
    </div>
  );
}
//import a from './a.scss'
//import className from 'classnames/bind'
function Cpp(props) {
  const cx = className.bind(a)
  return (
    <div className={cx('greenyellowbox')}>
      <h3>cpp</h3>
    </div>
  );
}

export default App;

바인드방법을쓰셈 이꼴저꼴안봄ㅅㄱ

얄루!

css가져오깅

b.css

.bluebox {
    background: blue;
    color: white;
    font-size: 2rem;
}
.yellowbox {
    background: yellow;
    color: white;
    font-size: 2rem;
}

app.js

import React from 'react';
import './index.scss';
import a from './a.scss'
import './b.css'
import b from './b.css'
import className from 'classnames/bind'
function App() {
  return (
    <div>
      <h2>app.js</h2>
      <Bpp/>
      <Cpp/>
      <Dpp/>
      <Fpp/>
    </div>
  );
}
//import './a.scss' 얘랑 짝지
function Bpp(props) {
  return (
    <div className={'Redbox'}>
      <h3>bpp</h3>
    </div>
  );
}
//import a from './a.scss'
//import className from 'classnames/bind'
function Cpp(props) {
  const cx = className.bind(a)
  return (
    <div className={cx('greenyellowbox')}>
      <h3>cpp</h3>
    </div>
  );
}

function Dpp(props) {
  return (
    <div className={'bluebox'}>
     <h3>Dpp</h3>
    </div>
  );
}
function Fpp(props) {
  const cxx = className.bind(b)
  return (
    <div className={cxx('yellowbox')}>
      <h3>Fpp</h3>
    </div>
  );
}


export default App;