diff --git a/data/db.json b/data/db.json deleted file mode 100644 index ece6273..0000000 --- a/data/db.json +++ /dev/null @@ -1,36 +0,0 @@ -{ - "posts": [ - { - "id": 1, - "likes": 30, - "title": "Welcome to the new blog", - "body": "Lorem ninja ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut ninja wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit ninja lobortis nisl ut aliquip ex ea commodo consequat. Duis ninja autem vel eum iriure dolor in hendrerit in vulputate ninja velit esse molestie consequat, vel illum dolore eu feugiat nulla ninja facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam ninja ipsum liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi ninja non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes ninja demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas ninja est etiam processus dynamicus, qui ninja sequitur mutationem consuetudium lectorum. Mirum ninja est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem ninja ipsum modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in ninja futurum." - }, - { - "id": 2, - "likes": 15, - "title": "How to be a Net Ninja", - "body": "Lorem ninja ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut ninja wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit ninja lobortis nisl ut aliquip ex ea commodo consequat. Duis ninja autem vel eum iriure dolor in hendrerit in vulputate ninja velit esse molestie consequat, vel illum dolore eu feugiat nulla ninja facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam ninja ipsum liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi ninja non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes ninja demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas ninja est etiam processus dynamicus, qui ninja sequitur mutationem consuetudium lectorum. Mirum ninja est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem ninja ipsum modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in ninja futurum." - }, - { - "title": "New Vue course coming soon!", - "body": "Lorem ninja ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut ninja wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit ninja lobortis nisl ut aliquip ex ea commodo consequat. Duis ninja autem vel eum iriure dolor in hendrerit in vulputate ninja velit esse molestie consequat, vel illum dolore eu feugiat nulla ninja facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam ninja ipsum liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi ninja non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes ninja demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas ninja est etiam processus dynamicus, qui ninja sequitur mutationem consuetudium lectorum. Mirum ninja est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem ninja ipsum modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in ninja futurum.", - "likes": 20, - "id": 3 - }, - { - "title": "Mario Kart Live review", - "body": "Lorem ninja ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut ninja wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit ninja lobortis nisl ut aliquip ex ea commodo consequat. Duis ninja autem vel eum iriure dolor in hendrerit in vulputate ninja velit esse molestie consequat, vel illum dolore eu feugiat nulla ninja facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam ninja ipsum liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi ninja non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes ninja demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas ninja est etiam processus dynamicus, qui ninja sequitur mutationem consuetudium lectorum. Mirum ninja est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem ninja ipsum modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in ninja futurum.", - "likes": 69, - "id": 4 - } - ], - "polls": [ - { - "id": 1, - "question": "Do you prefer Vue or React?", - "answerA": "Vue", - "answerB": "React" - } - ] -} \ No newline at end of file diff --git a/details.html b/details.html index adbddf9..3d66857 100644 --- a/details.html +++ b/details.html @@ -10,7 +10,6 @@
- diff --git a/index.html b/index.html index e2d75a4..4378457 100644 --- a/index.html +++ b/index.html @@ -6,18 +6,12 @@ JSON Server - - - -
diff --git a/js/create.js b/js/create.js index 0af846e..8bbb02f 100644 --- a/js/create.js +++ b/js/create.js @@ -1,22 +1 @@ -// javascript for create.html -const form = document.querySelector('form'); - -const createPost = async (e) => { - e.preventDefault(); - - const doc = { - title: form.title.value, - body: form.body.value, - likes: 0, - } - - await fetch('http://localhost:3000/posts', { - method: 'POST', - body: JSON.stringify(doc), - headers: { 'Content-Type': 'application/json' } - }) - - window.location.replace('/') -} - -form.addEventListener('submit', createPost); \ No newline at end of file +// javascript for create.html \ No newline at end of file diff --git a/js/details.js b/js/details.js index 46d3aa4..8fff1af 100644 --- a/js/details.js +++ b/js/details.js @@ -1,28 +1 @@ -// javascript for details.html -const id = new URLSearchParams(window.location.search).get('id'); -const container = document.querySelector('.details'); -const deleteBtn = document.querySelector('.delete'); - -const renderDetails = async () => { - const res = await fetch('http://localhost:3000/posts/' + id); - if (!res.ok) { - window.location.replace("/"); - } - const post = await res.json(); - - const template = ` -

${post.title}

-

${post.body}

- ` - - container.innerHTML = template; -} - -deleteBtn.addEventListener('click', async () => { - const res = await fetch('http://localhost:3000/posts/' + id, { - method: 'DELETE' - }); - window.location.replace("/"); -}) - -window.addEventListener('DOMContentLoaded', renderDetails); \ No newline at end of file +// javascript for details.html \ No newline at end of file diff --git a/js/index.js b/js/index.js index d8b5a78..ed1d1eb 100644 --- a/js/index.js +++ b/js/index.js @@ -1,37 +1 @@ -// javascript for index.html -const container = document.querySelector('.blogs'); -const searchForm = document.querySelector('.search'); - -const renderPosts = async (term) => { - console.log(term); - let uri = 'http://localhost:3000/posts?_sort=likes&_order=desc'; - if (term) { - uri += `&q=${term}` - } - - const res = await fetch(uri); - const posts = await res.json(); - console.log(posts); - - let template = ''; - posts.forEach(post => { - template += ` -
-

${post.title}

-

${post.likes} likes

-

${post.body.slice(0, 200)}...

- Read more -
- ` - }); - - container.innerHTML = template; -} - -// search -searchForm.addEventListener('submit', async (e) => { - e.preventDefault(); - renderPosts(searchForm.term.value.trim()); -}) - -window.addEventListener('DOMContentLoaded', () => renderPosts()); \ No newline at end of file +// javascript for index.html \ No newline at end of file diff --git a/styles.css b/styles.css index c39d574..c174312 100644 --- a/styles.css +++ b/styles.css @@ -37,20 +37,3 @@ input, textarea { textarea { min-height:200px; } - -/* post list */ -.post { - padding: 16px; - background: white; - border-radius: 10px; - margin: 20px 0; -} -.post h2 { - margin: 0; -} -.post p { - margin-top: 0; -} -.post a { - color: #36cca2; -}