글쓰는 감자

예제 도메인) https://realyun99.tistory.com:8080/mange/newpost?type=post#yj

Properties

Methods

예제

• 새 페이지로 이동하기

window.location.assign("http://www.naver.com"); //or
window.location = "http://www.naver.com";

• 현재 페이지 새로고침

window.location.reload(true);

• replace()를 사용해 새 페이지로 이동하기

function reloadPageWithHash() {
  var initialPage = window.location.pathname;
  window.location.replace('http://www.naver.com/#' + initialPage);
}

1. https://html5up.net/

템플릿이 많지는 않지만 퀄리티가 좋음!(무료)

2. https://themewagon.com/theme_tag/free/

생각보다 다양한 템플릿들 존재!(무료)

3. https://bootstrapthemes.co/items/free-bootstrap-templates/

다운 받으려면 sns에 공유하기를 해야만 한다. 하지만 좋은 반응형 템플릿들이 있음(무료)

4. https://themeforest.net/

자주 구매하는 곳(유료)

500 ERROR 상황

- 서버 통신의 Timeout 시간 지연 오류
- 서버 트래픽 과부하
- 서버 언어의 구문 에러(스크립트 문법 오류)

❗ 나의 경우에 스크립트 쪽 오류가 계속 떴었고 이는 폴더 이름들과 연관 있었다.

templates라 코드에 선언했지만 폴더 이름은 template이어서 경로가 맞지 않았던 것이다.

폴더 이름 생성에 있어서 유의해야겠다!! ❗

 "template을 자꾸 찾을 수 없다"는 오류가 떴다.

이는 handler 선언을 하지 않았기 때문에 뜬 오류이다! 경로를 설정해줘야 한다.

config 폴더를 생성해 안에 MvcConfig.java 파일을 생성하고 안에 핸들러를 선언해줘야 한다.

@Configuration
public class MvcConfig implements WebMvcConfigurer {

  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/static/**")
        .addResourceLocations("classpath:/static/")
        .setCachePeriod(3600000);
  }

}

위와 같이 WebMvcConfigurer를 implements 하고 addResourceHandlers 선언하고 경로를 찾아준다.

jQuery

• HTML 클라이언트 사이드 조작을 단순화하도록 설계된 크로스 플랫폼의 자바스크립트 라이브러리
• MIT 라이선스를 가진 자유 오픈 소프트웨어
• 사용 이유
  • 페이지 내부 요소에 접근하기 쉽다
  • 페이지의 보여지는 모습을 변경하기 쉽다
  • 상호작용 처리가 쉽고 애니메이션 사용 가능
  • AJAX의 사용이 쉽다

jQuery의 시작

$(document).ready(function(){
   // process.. 
});

제이쿼리가 자바스크립트보다 더 빨리 실행되는 이유는 document문서가 로드되었을 때(text문서만 로딩) 제이쿼리는 실행된다. 하지만 자바스크립트의 window.onload는 모든 내용을 로드 한 뒤 실행된다.

jQuery 선택자(selector)

❗ 이밖에도 jQuery문법은 다양하다. https://www.w3schools.com/jquERy/default.asp 를 참고하도록 ❗

Querydsl

• SQL, JPQL을 코드로 작성할 수 있도록 도와주는 빌더 API
• 오픈소스
• 장점
  • 문자가 아닌 코드로 작성
  • 컴파일 시점에 문법 오류를 발견
  • 코드 자동완성(IDE 도움)
  • 동적 쿼리

사용법

1. pom.xml에 dependency 추가

    <!-- Querydsl -->
    <dependency>
      <groupId>com.querydsl</groupId>
      <artifactId>querydsl-jpa</artifactId>
    </dependency>
    <dependency>
      <groupId>com.querydsl</groupId>
      <artifactId>querydsl-apt</artifactId>
      <scope>provided</scope>
    </dependency>

 <plugins>
 	<plugin>
       <groupId>org.springframework.boot</groupId>
       <artifactId>spring-boot-maven-plugin</artifactId>
       <configuration>
         <excludes>
           <exclude>
             <groupId>org.projectlombok</groupId>
             <artifactId>lombok</artifactId>
           </exclude>
         </excludes>
       </configuration>
    </plugin>
    <plugin>
       <groupId>com.mysema.maven</groupId>
       <artifactId>apt-maven-plugin</artifactId>
       <version>1.1.3</version>
       <executions>
         <execution>
           <goals>
             <goal>process</goal>
           </goals>
           <configuration>
             <outputDirectory>target/generated-sources/java</outputDirectory>
             <processor>com.querydsl.apt.jpa.JPAAnnotationProcessor</processor>
           </configuration>
         </execution>
       </executions>
     </plugin>
</plugins>

2. maven lifecycle을 이용해 "clean → compile" 하면 target 폴더 안에 Query Type 생성됨

3. repository/custom 안에 CustomRepository 생성 (Custom____Repository)

4. repository/support 안에 custom을 구현하는 Impl.java 파일 생성 (____RepositoryImpl.java)

5. 기존의 Repository에 CustomRepository를 extends에 추가 (____Repository)

❗ 복잡한 쿼리문은 querydsl을 통해서 코드 작성하는 게 보기에도 구현하기에도 편할 것 같다. ❗

❗ querydsl관련 : https://querydsl.com/ ❗