Skip to content

Commit 76b6303

Browse files
mahatmamahardhikachmahatmamahardhikach
committed
feat(tutorial): add mobile development tutorial collection
fix(laravel): escape Blade syntax in examples - Added new mobile tutorials. - Fixed Blade syntax for proper rendering.
1 parent 9a5c973 commit 76b6303

File tree

5 files changed

+137
-21
lines changed

5 files changed

+137
-21
lines changed

‎pages/faq/framework/Laravel/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,7 @@ Integrated frontend tooling:
220220
@extends('layouts.app')
221221

222222
@section('content')
223-
<h1>Welcome, {{ $user->name }}</h1>
223+
<h1>Welcome, {{ "{{" }} $user->name }}</h1>
224224
@endsection
225225

226226
// Vite integration

‎pages/faq/framework/Laravel/mail_in_laravel.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ Create email views in `resources/views/emails`:
9898

9999
```php
100100
// Plain text email
101-
<p>Hello, {{ $user->name }}!</p>
101+
<p>Hello, {{"{{"}} $user->name }}!</p>
102102
<p>Welcome to our application.</p>
103103

104104
// HTML email with styling
@@ -111,7 +111,7 @@ Create email views in `resources/views/emails`:
111111
</head>
112112
<body>
113113
<div class="email-content">
114-
<h1>Welcome {{ $user->name }}</h1>
114+
<h1>Welcome {{"{{"}} $user->name }}</h1>
115115
<p>Thanks for joining!</p>
116116
</div>
117117
</body>

‎pages/faq/framework/Laravel/slot_in_laravel.md‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ At its core, a slot is a placeholder within a component where parent content can
3535
```php
3636
// Component view (resources/views/components/card.blade.php)
3737
<div class="card">
38-
{{ $slot }}
38+
{{"{{"}} $slot }}
3939
</div>
4040

4141
// Usage in a parent view
@@ -52,13 +52,13 @@ Named slots allow you to create multiple content areas within a single component
5252
// Component view
5353
<div class="card">
5454
<div class="card-header">
55-
{{ $header }}
55+
{{"{{"}} $header }}
5656
</div>
5757
<div class="card-body">
58-
{{ $slot }}
58+
{{"{{"}} $slot }}
5959
</div>
6060
<div class="card-footer">
61-
{{ $footer }}
61+
{{"{{"}} $footer }}
6262
</div>
6363
</div>
6464

@@ -77,7 +77,7 @@ You can provide default content for slots that may not always be filled:
7777
```php
7878
// Component view
7979
<div class="alert">
80-
{{ $slot ?? 'Default alert message' }}
80+
{{"{{"}} $slot ?? 'Default alert message' }}
8181
</div>
8282
```
8383

@@ -87,8 +87,8 @@ Slots can have additional attributes for more dynamic rendering:
8787

8888
```php
8989
// Component view
90-
<div {{ $attributes->merge(['class' => 'default-class']) }}>
91-
{{ $slot }}
90+
<div {{"{{"}} $attributes->merge(['class' => 'default-class']) }}>
91+
{{"{{"}} $slot }}
9292
</div>
9393
```
9494

@@ -99,7 +99,7 @@ Implement conditional logic for slot content:
9999
```php
100100
@if($slot->isNotEmpty())
101101
<div class="content">
102-
{{ $slot }}
102+
{{"{{"}} $slot }}
103103
</div>
104104
@endif
105105
```
@@ -111,14 +111,14 @@ Advanced slot scoping allows passing data back to the parent:
111111
```php
112112
// Component
113113
<div>
114-
{{ $slot($user) }}
114+
{{"{{"}} $slot($user) }}
115115
</div>
116116

117117
// Usage
118118
<x-user-list>
119119
@foreach($users as $user)
120120
<x-slot:default="$user">
121-
{{ $user->name }}
121+
{{"{{"}} $user->name }}
122122
</x-slot:default>
123123
@endforeach
124124
</x-user-list>
@@ -132,13 +132,13 @@ Advanced slot scoping allows passing data back to the parent:
132132
// resources/views/components/modal.blade.php
133133
<div class="modal">
134134
<div class="modal-header">
135-
{{ $title }}
135+
{{"{{"}} $title }}
136136
</div>
137137
<div class="modal-body">
138-
{{ $slot }}
138+
{{"{{"}} $slot }}
139139
</div>
140140
<div class="modal-footer">
141-
{{ $footer }}
141+
{{"{{"}} $footer }}
142142
</div>
143143
</div>
144144

‎tutorial/mobile/index.md‎

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
---
2+
title: Mobile Development
3+
layout: default
4+
parent: Tutorial
5+
description: "Mobile Development Tutorial Collection"
6+
---
7+
8+
# Mobile Development Tutorial Collection
9+
10+
Welcome to the Mobile Development Tutorial Collection! This repository contains various tutorials to help you master
11+
mobile app development. Whether you are a beginner or an advanced developer, you'll find useful resources here.
12+
13+
## Table of Contents
14+
15+
- [Getting Started with Mobile Development](#getting-started-with-mobile-development)
16+
- [Building Android Apps with Kotlin](#building-android-apps-with-kotlin)
17+
- [Building iOS Apps with Swift](#building-ios-apps-with-swift)
18+
- [Cross-Platform Development with Flutter](#cross-platform-development-with-flutter)
19+
- [React Native for Cross-Platform Apps](#react-native-for-cross-platform-apps)
20+
- [Mobile Backend Integration](#mobile-backend-integration)
21+
- [Advanced Topics in Mobile Development](#advanced-topics-in-mobile-development)
22+
23+
---
24+
25+
## Getting Started with Mobile Development
26+
27+
Learn the basics of mobile development, including:
28+
29+
- Overview of mobile platforms.
30+
- Setting up development environments for Android and iOS.
31+
- Understanding the app lifecycle.
32+
33+
**[Read More](#)**
34+
35+
---
36+
37+
## Building Android Apps with Kotlin
38+
39+
This section covers Android app development using Kotlin, including:
40+
41+
- Setting up Android Studio.
42+
- Creating your first Android app.
43+
- Exploring layouts and UI components.
44+
- Working with Android APIs.
45+
46+
**[Read More](#)**
47+
48+
---
49+
50+
## Building iOS Apps with Swift
51+
52+
Learn how to develop iOS applications using Swift, including:
53+
54+
- Setting up Xcode.
55+
- Building your first iOS app.
56+
- Understanding Swift programming basics.
57+
- Integrating SwiftUI for UI design.
58+
59+
**[Read More](#)**
60+
61+
---
62+
63+
## Cross-Platform Development with Flutter
64+
65+
Discover the power of Flutter for cross-platform development:
66+
67+
- Setting up Flutter and Dart SDK.
68+
- Creating a simple cross-platform app.
69+
- Understanding widgets and state management.
70+
- Testing and deploying Flutter apps.
71+
72+
**[Read More](#)**
73+
74+
---
75+
76+
## React Native for Cross-Platform Apps
77+
78+
Learn to build cross-platform apps using React Native, including:
79+
80+
- Setting up the React Native environment.
81+
- Developing your first React Native app.
82+
- Using components and navigation.
83+
- Debugging and performance optimization.
84+
85+
**[Read More](#)**
86+
87+
---
88+
89+
## Mobile Backend Integration
90+
91+
Understand how to connect mobile apps with backends:
92+
93+
- RESTful APIs and GraphQL.
94+
- Firebase integration.
95+
- Real-time data synchronization.
96+
- Securing your backend communications.
97+
98+
**[Read More](#)**
99+
100+
---
101+
102+
## Advanced Topics in Mobile Development
103+
104+
Take your skills to the next level with advanced topics such as:
105+
106+
- Implementing animations and custom UI.
107+
- Optimizing app performance.
108+
- Using device hardware like GPS and camera.
109+
- Publishing apps to Google Play and App Store.
110+
111+
**[Read More](#)**
112+
113+
---
114+
115+
Feel free to explore the tutorials and enhance your mobile development skills. Contributions to expand this collection
116+
are always welcome!

‎tutorial/web/framework/laravel/laravel_component.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -63,10 +63,10 @@ Laravel components support dynamic attribute handling, allowing flexible renderi
6363

6464
```php
6565
// Accessing all passed attributes
66-
{{ $attributes }}
66+
{{"{{"}} $attributes }}
6767

6868
// Filtering or manipulating attributes
69-
{{ $attributes->merge(['class' => 'default-class']) }}
69+
{{"{{"}} $attributes->merge(['class' => 'default-class']) }}
7070
```
7171

7272
## Inline Component Views
@@ -86,8 +86,8 @@ Anonymous components provide a quick way to create one-off UI elements without d
8686

8787
```php
8888
// resources/views/components/alert.blade.php
89-
<div {{ $attributes->merge(['class' => 'alert']) }}>
90-
{{ $slot }}
89+
<div {{"{{"}} $attributes->merge(['class' => 'alert']) }}>
90+
{{"{{"}} $slot }}
9191
</div>
9292
```
9393

@@ -136,7 +136,7 @@ Manage component classes and styling:
136136

137137
```php
138138
// Merging default and dynamic classes
139-
<div {{ $attributes->class(['base-class', 'dynamic-class']) }}>
139+
<div {{"{{"}} $attributes->class(['base-class', 'dynamic-class']) }}>
140140
Content
141141
</div>
142142
```

0 commit comments

Comments
 (0)