Skip to content

Commit f913251

Browse files
committed
courses
1 parent 8906e1e commit f913251

File tree

6 files changed

+157
-2
lines changed

6 files changed

+157
-2
lines changed

components/CourseCard.vue

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<template>
2+
<div class="grid grid-cols-3 gap-6 rounded-lg shadow bg-white dark:bg-gray-800 p-6 hover:shadow-lg dark:hover:bg-black">
3+
<nuxt-link :to="course.url"><img :src="course.image_url" class="bg-white w-full object-cover" :alt="course.name" /></nuxt-link>
4+
<div class="col-span-2 space-y-4 flex flex-col">
5+
<nuxt-link :to="course.url" class="font-bold">{{ course.name }}</nuxt-link>
6+
<div>
7+
来自 <nuxt-link :to="course.author_url">{{ course.author }}</nuxt-link>
8+
</div>
9+
<nuxt-link :to="course.url" class="block w-full flex-1">
10+
{{ course.introduction }}
11+
</nuxt-link>
12+
</div>
13+
</div>
14+
</template>
15+
<script lang="ts">
16+
export default {
17+
props: {
18+
course: {
19+
type: Object,
20+
required: true,
21+
},
22+
},
23+
}
24+
</script>

components/TheNavbar.vue

+13
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,19 @@
4242
>
4343
Tips
4444
</NuxtLink> -->
45+
<NuxtLink
46+
to="/courses"
47+
class="flex items-center space-x-2 px-2 py-1 mx-2 mt-2 text-sm font-medium transition-colors duration-200 transform rounded-md md:mt-0 text-gray-600 hover:text-gray-700 dark:hover:text-gray-200 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-700"
48+
>
49+
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
50+
<path
51+
stroke-linecap="round"
52+
stroke-linejoin="round"
53+
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"
54+
/>
55+
</svg>
56+
<span>教程</span>
57+
</NuxtLink>
4558
<NuxtLink
4659
to="/stars"
4760
class="flex items-center space-x-2 px-2 py-1 mx-2 mt-2 text-sm font-medium transition-colors duration-200 transform rounded-md md:mt-0 text-gray-600 hover:text-gray-700 dark:hover:text-gray-200 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-700"

content/courses.json

+95
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
[
2+
{
3+
"name": "Laravel 教程 - Web 开发实战入门",
4+
"author": "Learnku",
5+
"author_url": "https://learnku.com",
6+
"introduction": "本书将手把手带您构建类似微博应用,让您在实战中领略 Laravel 开发的敏捷与高效。话题包括 HTML、CSS、JavaScript、PHP、Laravel、 Git 工作流、前端工作流、Bootstrap 等。",
7+
"url": "https://learnku.com/courses/laravel-essential-training/9.x",
8+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/MYg2QNQfss.png!/both/400x400"
9+
},
10+
11+
{
12+
"name": "Laravel 教程 - Web 开发实战进阶",
13+
"author": "Learnku",
14+
"author_url": "https://learnku.com",
15+
"introduction": "本课程我们会开发论坛软件。话题包括多角色权限系统、管理员后台、验证码、图片上传和裁剪,XSS、自定义命令行、自定义中间件、Cron、队列、缓存、Redis、事件、验证、通知、邮件等。",
16+
"url": "https://learnku.com/courses/laravel-intermediate-training/9.x",
17+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/Eya5MlZCuH.png!/both/400x400"
18+
},
19+
20+
{
21+
"name": "Laravel 教程 - 实战构架 API 服务器",
22+
"author": "Learnku",
23+
"author_url": "https://learnku.com",
24+
"introduction": "本书主要专注于 App 的后端 API 服务器开发。话题包括 RESTFul API 设计、PostMan、OAuth、Fractal、Transformer、API 图片上传,JWT、调试公众号 OAuth 流程、图片验证码等。",
25+
"url": "https://learnku.com/courses/laravel-advance-training/8.x",
26+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/LEJyMUoXVQ.png!/both/400x400"
27+
},
28+
29+
{
30+
"name": "Laravel 教程 - 微信小程序从零到发布",
31+
"author": "Learnku",
32+
"author_url": "https://learnku.com",
33+
"introduction": "从第一行代码,到微信小程序的提交发布。涉及知识:小程序申请、WePY、WeUI、登录及 Token 刷新、删除、手机注册、Badge 提示、用户权限、微信后台提交。",
34+
"url": "https://learnku.com/courses/laravel-weapp/2.0",
35+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/YtwiopnTgn.png!/both/400x400"
36+
},
37+
38+
{
39+
"name": "Laravel 教程 - 电商实战",
40+
"author": "Learnku",
41+
"author_url": "https://learnku.com",
42+
"introduction": "电商项目功能:权限和商品管理、SKU、购物车、订单、支付宝微信支付、商品评价和收藏、退款、优惠券。技术话题包括事务、订单流水号、事件和监听器、MailHog、Service 模式、自定验证器等。",
43+
"url": "https://learnku.com/courses/laravel-shop/8.x",
44+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/mj8qSkmZzw.png!/both/400x400"
45+
},
46+
47+
{
48+
"name": "Laravel 教程 - 电商进阶",
49+
"author": "Learnku",
50+
"author_url": "https://learnku.com",
51+
"introduction": "基于 L05 功能:无限级分类、众筹、分期付款(逾期、退款)、Elasticsearch 搜索、分面搜索、相似商品查询(类似于亚马逊的『商品推荐』功能)、秒杀商品管理、秒杀、多机部署实现负载均衡。",
52+
"url": "https://learnku.com/courses/ecommerce-advance/8.x",
53+
"image_url": "https://cdn.learnku.com/uploads/images/201810/26/1/lto59p5rEM.png!/both/400x400"
54+
},
55+
{
56+
"name": "Laravel 教程 - TDD 测试",
57+
"author": "Learnku",
58+
"author_url": "https://learnku.com",
59+
"introduction": "Laravel 测试入门",
60+
"url": "https://learnku.com/courses/laravel-testing/8.x",
61+
"image_url": "https://cdn.learnku.com/uploads/images/201902/15/1/vPC8DwzaJC.jpg!/both/400x400"
62+
},
63+
{
64+
"name": "Laravel / PHP 扩展包视频教程 (每周更新)",
65+
"author": "Learnku",
66+
"author_url": "https://learnku.com",
67+
"introduction": "每周精选两个以上扩展包进行讲解,涵盖 PHP 和 Laravel 相关的最新、最热、最常用的扩展包。每个视频不会超过 10 分钟,以实战为核心,所有源代码开源托管在 GitHub 。此视频已不再更新,订阅可永久观看视频。",
68+
"url": "https://learnku.com/courses/laravel-package/2019",
69+
"image_url": "https://cdn.learnku.com/uploads/images/201808/06/1/S5h9WvQSk4.png!/both/400x400"
70+
},
71+
{
72+
"name": "PHP 扩展包实战教程 - 从入门到发布",
73+
"author": "overtrue",
74+
"author_url": "https://github.com/overtrue",
75+
"introduction": "经验丰富的 PHP 扩展包开发者带你一步步从 0 开始发布你的第一个扩展包",
76+
"url": "https://learnku.com/courses/creating-package",
77+
"image_url": "https://cdn.learnku.com/uploads/images/201807/23/1/NCEii0F1bc.png!/both/400x400"
78+
},
79+
{
80+
"name": "Laravel 性能优化入门",
81+
"author": "Learnku",
82+
"author_url": "https://learnku.com",
83+
"introduction": "经验丰富的 PHP 扩展包开发者带你一步步从 0 开始发布你的第一个扩展包",
84+
"url": "https://learnku.com/courses/laravel-performance/8.x",
85+
"image_url": "https://cdn.learnku.com/uploads/images/201906/17/1/rIC2Vg4qYB.jpg!/both/400x400"
86+
},
87+
{
88+
"name": "Laravel / PHP 五分钟视频 (每周更新)",
89+
"author": "Learnku",
90+
"author_url": "https://learnku.com",
91+
"introduction": "单个视频长度 3~15分钟,覆盖技巧技巧、工具、第三方包、标准库、开源项目、源码分析、实战小项目等。",
92+
"url": "https://learnku.com/courses/php-laravel-video/2022",
93+
"image_url": "https://cdn.learnku.com/uploads/images/202111/24/1/igBh3rrC0B.png!/both/400x400"
94+
}
95+
]

pages/courses.vue

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<template>
2+
<div class="mt-8 space-y-6">
3+
<header class="space-y-4">
4+
<div class="flex justify-between items-center">
5+
<h1 class="text-3xl mb-0 text-gray-700 dark:text-gray-300">教程</h1>
6+
<the-link-button href="https://github.com/overtrue/laravel.xyz/edit/master/content/packages.json" class="flex items-center space-x-2">
7+
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
8+
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
9+
</svg>
10+
<span>推荐更多课程</span>
11+
</the-link-button>
12+
</div>
13+
<div class="text-gray-500 dark:text-gray-500">通过教程,我们可以更深入系统的学习使用 Laravel。</div>
14+
</header>
15+
<div class="gap-6 flex-1 grid grid-cols-1 xl:grid-cols-2">
16+
<course-card v-for="course of courses.body" :course="course" :key="course.name"></course-card>
17+
</div>
18+
</div>
19+
</template>
20+
21+
<script setup>
22+
const { data: courses } = await useAsyncData('courses', () => queryContent('/courses').findOne())
23+
</script>

pages/packages.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
88
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
99
</svg>
10-
<span>提议更多扩展包</span>
10+
<span>推荐更多扩展包</span>
1111
</the-link-button>
1212
</div>
1313
<p class="text-gray-500 dark:text-gray-500">一些开源的让你更方便创建Laravel应用的库或者组件。</p>

pages/stars.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
88
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
99
</svg>
10-
<span>提议更多人选</span>
10+
<span>推荐更多人选</span>
1111
</the-link-button>
1212
</div>
1313
<div class="text-gray-500 dark:text-gray-500">因为这些大佬的无私奉献,才有了 Laravel 的今天。</div>

0 commit comments

Comments
 (0)