feat : routing setting Complete
This commit is contained in:
minseokkang
@@ -14,26 +14,26 @@ node {
|
||||
* true: 다운로드 및 설치
|
||||
* false: 전역으로 설치된 Node.js 사용함.
|
||||
*/
|
||||
download = true
|
||||
//download = true
|
||||
|
||||
/**
|
||||
* download가 true일 경우에만 사용
|
||||
* version에 명시한 버전으로 Node.js 다운로드 및 설치
|
||||
* workDir에 설치됨
|
||||
*/
|
||||
version = "14.17.6"
|
||||
//version = "14.17.6"
|
||||
|
||||
/**
|
||||
* 사용할 npm 버전을 지정하면 npmWorkDir에 설치됨
|
||||
* npm 버전을 지정하지 않으면 Node.js에 번들로 제공되는 npm 버전으로 사용됨
|
||||
*/
|
||||
npmVersion = "6.14.15"
|
||||
//npmVersion = "6.14.15"
|
||||
|
||||
/**
|
||||
* download가 true일 경우에만 사용
|
||||
* Node.js 배포를 가져오기 위한 기본 URL
|
||||
*/
|
||||
distBaseUrl = "https://nodejs.org/dist"
|
||||
//distBaseUrl = "https://nodejs.org/dist"
|
||||
|
||||
|
||||
npmInstallCommand = "install"
|
||||
|
||||
12049
src/frontend/package-lock.json
generated
12049
src/frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -13,7 +13,8 @@
|
||||
"https-browserify": "^1.0.0",
|
||||
"path": "^0.12.7",
|
||||
"request": "^2.88.2",
|
||||
"vue": "^3.2.13"
|
||||
"vue": "^3.2.13",
|
||||
"vue-router": "^4.0.13"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.12.16",
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<body>
|
||||
hello?
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
<template>
|
||||
<TheHeader></TheHeader>
|
||||
<TheHome></TheHome>
|
||||
<router-view></router-view>
|
||||
<TheFooter></TheFooter>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TheHome from '@/views/TheHome'
|
||||
import TheHeader from '@/components/TheHeader.vue'
|
||||
import TheFooter from "@/components/TheFooter";
|
||||
|
||||
@@ -13,7 +12,6 @@ export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
TheHeader,
|
||||
TheHome,
|
||||
TheFooter
|
||||
},
|
||||
|
||||
|
||||
@@ -1,58 +0,0 @@
|
||||
<template>
|
||||
<div class="hello">
|
||||
<h1>{{ msg }}</h1>
|
||||
<p>
|
||||
For a guide and recipes on how to configure / customize this project,<br>
|
||||
check out the
|
||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
|
||||
</p>
|
||||
<h3>Installed CLI Plugins</h3>
|
||||
<ul>
|
||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
|
||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
|
||||
</ul>
|
||||
<h3>Essential Links</h3>
|
||||
<ul>
|
||||
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
|
||||
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
|
||||
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
|
||||
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
|
||||
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
|
||||
</ul>
|
||||
<h3>Ecosystem</h3>
|
||||
<ul>
|
||||
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
|
||||
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
|
||||
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
|
||||
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
|
||||
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
props: {
|
||||
msg: String
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
h3 {
|
||||
margin: 40px 0 0;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
}
|
||||
a {
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
||||
@@ -13,27 +13,23 @@
|
||||
|
||||
<nav class="navbar navbar-light">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="index.html">conduit</a>
|
||||
<a class="navbar-brand" href="/">conduit</a>
|
||||
<ul class="nav navbar-nav pull-xs-right">
|
||||
<li class="nav-item">
|
||||
<!-- Add "active" class when you're on that page" -->
|
||||
<a class="nav-link active" href="">Home</a>
|
||||
<router-link to="/" class="nav-link active" active-class="active">Home</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="">
|
||||
<i class="ion-compose"></i> New Article
|
||||
</a>
|
||||
<router-link to="/article" class="nav-link" active-class="active">New Article</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="">
|
||||
<i class="ion-gear-a"></i> Settings
|
||||
</a>
|
||||
<router-link to="/setting" class="nav-link" active-class="active"><i class="ion-gear-a"></i>Settings</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="">Sign in</a>
|
||||
<router-link to="/login" class="nav-link" active-class="active">Sign in</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="">Sign up</a>
|
||||
<router-link to="/signup" class="nav-link" active-class="active">Sign up</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,8 @@
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from "./router";
|
||||
|
||||
const app = createApp(App);
|
||||
app.use(router);
|
||||
app.mount('#app');
|
||||
|
||||
createApp(App).mount('#app')
|
||||
|
||||
36
src/frontend/src/router/index.js
Normal file
36
src/frontend/src/router/index.js
Normal file
@@ -0,0 +1,36 @@
|
||||
import { createWebHistory, createRouter } from "vue-router";
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
name: "Home",
|
||||
component: () => import(/* webpackChunkName "home" */ '@/views/TheHome.vue')
|
||||
},
|
||||
{
|
||||
path: "/setting",
|
||||
name: "Setting",
|
||||
component: () => import(/* webpackChunkName "inputTag" */ '@/views/TheSetting.vue')
|
||||
},
|
||||
{
|
||||
path: "/login",
|
||||
name: "Login",
|
||||
component: () => import(/* webpackChunkName "inputTag" */ '@/views/TheLogin.vue')
|
||||
},
|
||||
{
|
||||
path: "/signup",
|
||||
name: "SignUp",
|
||||
component: () => import(/* webpackChunkName "inputTag" */ '@/views/TheSignUp.vue')
|
||||
},
|
||||
{
|
||||
path: "/article",
|
||||
name: "Article",
|
||||
component: () => import(/* webpackChunkName "inputTag" */ '@/views/TheArticle.vue')
|
||||
},
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(),
|
||||
routes,
|
||||
});
|
||||
|
||||
export default router;
|
||||
46
src/frontend/src/views/TheArticle.vue
Normal file
46
src/frontend/src/views/TheArticle.vue
Normal file
@@ -0,0 +1,46 @@
|
||||
<template>
|
||||
|
||||
<div class="editor-page">
|
||||
<div class="container page">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-10 offset-md-1 col-xs-12">
|
||||
<form>
|
||||
<fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input type="text" class="form-control form-control-lg" placeholder="Article Title">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input type="text" class="form-control" placeholder="What's this article about?">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<textarea class="form-control" rows="8"
|
||||
placeholder="Write your article (in markdown)"></textarea>
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input type="text" class="form-control" placeholder="Enter tags">
|
||||
<div class="tag-list"></div>
|
||||
</fieldset>
|
||||
<button class="btn btn-lg pull-xs-right btn-primary" type="button">
|
||||
Publish Article
|
||||
</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TheArticle"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
46
src/frontend/src/views/TheLogin.vue
Normal file
46
src/frontend/src/views/TheLogin.vue
Normal file
@@ -0,0 +1,46 @@
|
||||
<template>
|
||||
|
||||
<div class="auth-page">
|
||||
<div class="container page">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6 offset-md-3 col-xs-12">
|
||||
<h1 class="text-xs-center">Sign up</h1>
|
||||
<p class="text-xs-center">
|
||||
<a href="">Have an account?</a>
|
||||
</p>
|
||||
|
||||
<ul class="error-messages">
|
||||
<li>That email is already taken</li>
|
||||
</ul>
|
||||
|
||||
<form>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Your Name">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Email">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="password" placeholder="Password">
|
||||
</fieldset>
|
||||
<button class="btn btn-lg btn-primary pull-xs-right">
|
||||
Sign up
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TheLogin"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
48
src/frontend/src/views/TheSetting.vue
Normal file
48
src/frontend/src/views/TheSetting.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
|
||||
<div class="settings-page">
|
||||
<div class="container page">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6 offset-md-3 col-xs-12">
|
||||
<h1 class="text-xs-center">Your Settings</h1>
|
||||
|
||||
<form>
|
||||
<fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control" type="text" placeholder="URL of profile picture">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Your Name">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<textarea class="form-control form-control-lg" rows="8"
|
||||
placeholder="Short bio about you"></textarea>
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Email">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="password" placeholder="Password">
|
||||
</fieldset>
|
||||
<button class="btn btn-lg btn-primary pull-xs-right">
|
||||
Update Settings
|
||||
</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TheSetting"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
46
src/frontend/src/views/TheSignUp.vue
Normal file
46
src/frontend/src/views/TheSignUp.vue
Normal file
@@ -0,0 +1,46 @@
|
||||
<template>
|
||||
|
||||
<div class="auth-page">
|
||||
<div class="container page">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-6 offset-md-3 col-xs-12">
|
||||
<h1 class="text-xs-center">Sign up</h1>
|
||||
<p class="text-xs-center">
|
||||
<a href="">Have an account?</a>
|
||||
</p>
|
||||
|
||||
<ul class="error-messages">
|
||||
<li>That email is already taken</li>
|
||||
</ul>
|
||||
|
||||
<form>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Your Name">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Email">
|
||||
</fieldset>
|
||||
<fieldset class="form-group">
|
||||
<input class="form-control form-control-lg" type="password" placeholder="Password">
|
||||
</fieldset>
|
||||
<button class="btn btn-lg btn-primary pull-xs-right">
|
||||
Sign up
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TheSignUp.vue"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -42,7 +42,7 @@ public class WebConfig {
|
||||
public SecurityFilterChain resources(HttpSecurity http) throws Exception {
|
||||
http.csrf().disable()
|
||||
.requestMatchers((matchers) -> {matchers.antMatchers("/h2-console/**");
|
||||
matchers.antMatchers(HttpMethod.GET,"/api/articles/**","/");})
|
||||
matchers.antMatchers(HttpMethod.GET,"/api/articles/**","/**");})
|
||||
.authorizeHttpRequests((authorize) -> authorize.anyRequest().permitAll())
|
||||
.requestCache().disable()
|
||||
.securityContext().disable()
|
||||
|
||||
Reference in New Issue
Block a user