Skip to content

Commit

Permalink
fix path /portofolio
Browse files Browse the repository at this point in the history
  • Loading branch information
fiiann committed Dec 21, 2024
1 parent 8c1dfe8 commit eebdba1
Show file tree
Hide file tree
Showing 12 changed files with 42 additions and 33 deletions.
8 changes: 4 additions & 4 deletions src/collections/content/post.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,27 +4,27 @@
"description": "Learn how to integrate Google Sign-In authentication in a Flutter app using Supabase as the backend service. This comprehensive guide covers the essential steps and prerequisites.",
"dateFormatted": "June 9th, 2024",
"content": "# Introduction\n\nIn the ever-evolving landscape of mobile app development, **authentication** is a **critical aspect** that directly influences user experience and security. This article will guide you through the process of integrating **Google Sign-In authentication** into a **Flutter** app, leveraging the power of **Supabase** as a backend service.\n\n# Background\n\nBefore we dive into the implementation, let’s briefly discuss the technologies involved:\n\n1. **Flutter** ([https://flutter.dev/](http://flutter.dev/)): A popular open-source UI software development toolkit by Google for building natively compiled applications for mobile, web, and desktop from a single codebase.\n2. **Supabase** ([https://supabase.com/](http://supabase.com/)): An open-source Firebase alternative, Supabase provides a scalable and secure backend-as-a-service (BaaS) infrastructure for applications.\n\n## Prerequisites\n\nBefore getting started, make sure you have the following prerequisites:\n\n1. Flutter SDK installed, we used v3.16.0\n2. Supabase account and project set up\n3. Basic understanding of Flutter and Dart programming language\n\n## What we're building\n\nOur minimalist Flutter app will consist of **two pages**:\n\n1. **Login Page**: The entry point to our application, the login page, will leverage Google Sign-In to provide users with a convenient and secure authentication process. Users will be able to sign in using their Google credentials, ensuring a smooth onboarding experience.\n2. **Profile Page**: Once authenticated, users will land on the profile page. Here, we’ll explore how to store essential user data in Supabase — *a powerful backend service.* The profile page serves not only as a display of user information but also as a testament to the robust integration between our Flutter app and Supabase.\n\nNow, let’s dive into the step-by-step guide and bring these pages to life, combining the efficiency of Flutter’s UI toolkit, the simplicity of Google Sign-In, and the robustness of Supabase.\n\n## Step By Step Guide\n\n1. **Create a flutter app**\n Begin by creating a new Flutter project using the following command:\n\n `flutter create your_project_name`\n\n2. **Add dependency of supabase_flutter and google_sign_in**\n You can do it by using command:\n\n `flutter pub add supabase_flutter google_sign_in`\n\n3. **Setting Supabase**. Sign in or Sign up in [supabase.com](https://supabase.com/), and then create a project.\n\n... (other steps as needed)",
"link": "/post/google-sign-in-flutter-supabase"
"link": "/portofolio/post/google-sign-in-flutter-supabase"
},
{
"title": "The Perfect Brew for Optimal Productivity",
"description": "This is a post about how creating and developing a blog for yourself can be beneficial.",
"dateFormatted": "July 7th, 2023",
"content": "![Coffee and Code](/assets/images/posts/perfect-coffee.jpg)\n\n**Introduction**\n\nGreetings, fellow keyboard warriors and design dreamers! ☕️ Ever wondered why coffee shops are the unofficial office of developers and designers worldwide? Let's dive deep into the aromatic world of coffee and its symbiotic relationship with our craft.\n\n**Why Coffee and Coding Go Hand in Hand**\n\n1. **Caffeine Boost**: That gentle nudge of alertness can be the difference between a bug and a breakthrough.\n2. **Ritualistic Zen**: The process of brewing, the aroma, the first sip—it's a ritual that centers the mind.\n3. **Ambient Vibes**: The soft hum of conversations, the clinking of cups—it's the perfect white noise for concentration.\n\n![Pour Over](/assets/images/posts/pour-over.jpg)\n\n> \"Coffee is the common man’s gold, and like gold, it brings to every person the feeling of luxury and nobility.\" - Sheik-Abd-al-Kadir\n\n**Crafting the Perfect Coffee for Coding Sessions**\n\n- **Beans Matter**: Opt for single-origin, freshly roasted beans. The flavor profile can be a journey in itself.\n- **Brewing Techniques**: Whether it's Aeropress, French press, or pour-over, find what tickles your taste buds and suits your coding rhythm.\n- **Mind the Time**: Don't brew just before a deep debugging session; you don't want to be jittery when tracing that elusive bug.\n- **Stay Hydrated**: Remember, for every cup of coffee, drink a glass of water. Balance is key.\n\n**Conclusion**\n\nCoffee isn't just a beverage; for many of us, it's a lifeline, a muse, and a silent partner in our coding escapades. So, whether you're a latte lover or an espresso enthusiast, here's to the brew that fuels our passion. Code on and keep sipping! 🖤",
"link": "/post/the-perfect-brew"
"link": "/portofolio/post/the-perfect-brew"
},
{
"title": "The Revival of Vintage Tech",
"description": "Embark on a nostalgic journey exploring the charm of vintage tech and its unexpected resurgence among modern developers and designers.",
"dateFormatted": "July 27th, 2023",
"content": "![Vintage Tech](/assets/images/posts/vintage-tech-01.jpg)\n\n**Introduction**\n\nHey, digital nomads and pixel perfectionists! 🌌 In our quest for the sleekest UIs and the most efficient algorithms, have we forgotten the tactile joy of analog tech? Let's take a nostalgic trip down memory lane and explore why vintage tech is making a comeback in our hyper-digital age.\n\n**The Allure of Analog**\n\n1. **Tactile Satisfaction**: There's something undeniably satisfying about the clack of a typewriter or the whir of a rotary phone.\n2. **Digital Detox**: Vintage tech offers a break from the constant pings and notifications of our modern devices.\n3. **Aesthetic Appeal**: Let's be honest, a vinyl record player just looks cooler than a Bluetooth speaker.\n\n![Vintage Tech](/assets/images/posts/vintage-tech-02.jpg)\n\n> \"In our rush to the future, we often forget the beauty of the past.\" - Yours Truly\n\n**Why Developers and Designers are Embracing the Past**\n\n- **Inspiration**: Old tech brings a fresh perspective, sparking creativity in unexpected ways.\n- **Mindfulness**: Analog devices, devoid of distractions, promote a more focused and intentional work ethic.\n- **Nostalgia**: For those of us who grew up in the 90s, there's a comforting familiarity in the tech of yesteryears.\n\n**Conclusion**\n\nSo, next time you're stuck in a coding rut or facing designer's block, maybe swap out the MacBook for a typewriter, or trade Spotify for a vinyl spin. Sometimes, the past holds the key to unlocking our future creativity. Stay groovy and keep designing outside the box! 🚀",
"link": "/post/vintage-tech"
"link": "/portofolio/post/vintage-tech"
},
{
"title": "Writing Less, Achieving More",
"description": "Delve into the art of minimalist coding, where simplicity reigns supreme, leading to clearer, more efficient, and aesthetically pleasing code.",
"dateFormatted": "July 27th, 2023",
"content": "![Writing Less, Achieve More](/assets/images/posts/workspace.jpg)\n\n**Introduction**\n\nHey there, fellow code artisans and design enthusiasts! 🌿 In a world obsessed with more—more features, more functions, more everything—it's time we talk about the beauty of less. Dive with me into the world of minimalist code and discover how simplicity can be the ultimate sophistication.\n\n**The Philosophy Behind Minimalism**\n\n1. **Clarity Over Clutter**: Clean code is easier to read, debug, and maintain.\n2. **Efficiency**: Often, the simplest solution is the most efficient one, both in terms of performance and development time.\n3. **Aesthetics**: Just as a minimalist design pleases the eye, minimalist code is a joy to the developer's soul.\n\n![Writing Less, Achieve More](/assets/images/posts/flowchart.jpg)\n\n> \"Simplicity is the ultimate sophistication.\" - Leonardo da Vinci (Yeah, he wasn't talking about code, but it still applies, right?)\n\n**Tips for Embracing Minimalist Coding**\n\n- **Refactor Relentlessly**: Always be on the lookout for ways to streamline and optimize your code.\n- **Embrace White Space**: Just as in design, white space in code can improve readability and comprehension.\n- **Prioritize Functionality**: Before adding a new feature, ask yourself if it truly adds value or just complicates things.\n- **Stay Updated**: Newer coding practices and languages often offer more concise ways to achieve the same results.\n\n**Conclusion**\n\nMinimalism isn't just a design trend; it's a mindset. In our coding journeys, it's essential to remember that sometimes, less truly is more. So, the next time you're about to write that extra line of code, pause and ponder—could there be a simpler, more elegant solution? Keep it simple, and happy coding! ✨",
"link": "/post/writing-less-achieving-more"
"link": "/portofolio/post/writing-less-achieving-more"
}
]
8 changes: 4 additions & 4 deletions src/collections/experiences.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,20 @@
"role": "Front-end Engineer",
"company": "Full Truck Alliance",
"description": "Responsible for customer service and CRM system front-end development.",
"logo": "/assets/images/experiences/fta.ico"
"logo": "/portofolio/assets/images/experiences/fta.ico"
},
{
"dates": "July 2015 · June 2018",
"role": "Front-end Engineer",
"company": "YOHO!",
"description": "Responsible for mobile front-end development of e-commerce platform.",
"logo": "/assets/images/experiences/yoho.ico"
"logo": "/portofolio/assets/images/experiences/yoho.ico"
},
{
"dates": "September 2014 · July 2015 ",
"role": "Node.JS Developer",
"company": "WuLian",
"description": "Intern, involved in the development of Internet of Things cloud systems.",
"logo": "/assets/images/experiences/wulian.ico"
"logo": "/portofolio/assets/images/experiences/wulian.ico"
}
]
]
10 changes: 5 additions & 5 deletions src/collections/menu.json
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
[
{
"name": "Home",
"url": "/"
"url": "/portofolio"
},
{
"name": "Posts",
"url": "/posts"
"url": "/portofolio/posts"
},
{
"name": "Projects",
"url": "/projects"
"url": "/portofolio/projects"
},
{
"name": "About",
"url": "/about"
"url": "/portofolio/about"
}
]
]
8 changes: 4 additions & 4 deletions src/collections/projects.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,25 +2,25 @@
{
"name": "Sayo",
"description": "Practice speaking English with our advanced AI, simulating real-life conversations to enhance your speaking and listening skills",
"image": "/assets/images/projects/sayo.jpeg",
"image": "/portofolio/assets/images/projects/sayo.jpeg",
"url": "https://www.sayo.ai/"
},
{
"name": "Hits Hutama Karya",
"description": "Hits Hutama Karya is a comprehensive HRIS mobile app offering employee self-service, recruitment, onboarding, performance management, compensation, succession planning, and secure data management for HR leaders and employees on iOS and Android.",
"image": "/assets/images/projects/dns.surf.png",
"image": "/portofolio/assets/images/projects/dns.surf.png",
"url": "https://play.google.com/store/apps/details?id=com.hutamakarya.hits"
},
{
"name": "iHome-Security",
"description": "iHome Security is an app designed for residential security clusters, enabling security personnel to manage daily attendance, conduct patrols, record visitor information, and report incidents efficiently.",
"image": "/assets/images/projects/ihome.jpeg",
"image": "/portofolio/assets/images/projects/ihome.jpeg",
"url": "https://klasterpintar.com/"
},
{
"name": "Absenku Profesional",
"description": "Absenku Profesional is a comprehensive attendance management app with features like face recognition, geotagging, shift scheduling, and detailed reporting, allowing you to monitor and manage employee attendance, leave requests, and work locations efficiently.",
"image": "/assets/images/projects/absenku.jpeg",
"image": "/portofolio/assets/images/projects/absenku.jpeg",
"url": "https://absenku.com"
}
]
21 changes: 15 additions & 6 deletions src/pages/about.astro
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,17 @@ import Layout from "../layouts/main.astro";
description="Hello 👋 I'm a frontend engineer from Nanjing, China. I'm passionate about building new products and learning new technology."
/>

<img src="/assets/images/about.jpg" class="relative z-30 w-full my-10 rounded-xl" />
<img
src="/portofolio/assets/images/about.jpg"
class="relative z-30 w-full my-10 rounded-xl"
/>

<h2 class="mb-2 text-2xl font-bold dark:text-neutral-200">Short Bio</h2>
<p
class="text-sm leading-6 text-gray-600 dark:text-neutral-400 sm:leading-7 lg:leading-8 sm:text-base lg:text-lg"
>
Front-end cutter 🧑🏻‍💻, back-end amateur 🤷🏻‍♂️, operations digging holes person 🤦🏻‍♂️.
Front-end cutter 🧑🏻‍💻, back-end amateur 🤷🏻‍♂️, operations digging holes person
🤦🏻‍♂️.
</p>

<h2
Expand Down Expand Up @@ -51,21 +55,26 @@ import Layout from "../layouts/main.astro";
/>
)}
</>
)
);
})
}
</div>

<h2 class="mt-5 mb-2 text-2xl font-bold lg:mt-10 sm:mt-6 dark:text-neutral-200">Let's Connect</h2>
<h2
class="mt-5 mb-2 text-2xl font-bold lg:mt-10 sm:mt-6 dark:text-neutral-200"
>
Let's Connect
</h2>
<p
class="text-sm leading-6 text-gray-600 dark:text-neutral-400 sm:leading-7 lg:leading-8 sm:text-base lg:text-lg"
>
If you want to stay up to date with my work be sure to <a
href="https://twitter.com/ccikai"
target="_blank"
class="text-indigo-600 underline">follow me on twitter</a
>, or you can send me an <a href="mailto:astro-aria#miantiao.me" class="text-indigo-600 underline"
>email</a
>, or you can send me an <a
href="mailto:astro-aria#miantiao.me"
class="text-indigo-600 underline">email</a
> and I'll be sure to get back to you.
</p>
</section>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/index.astro
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ import Layout from "../layouts/main.astro";
</div>
<div class="relative z-30 px-10">
<img
src="/assets/images/photo.png"
src="/portofolio/assets/images/photo.png"
loading="eager"
decoding="auto"
class="relative z-30 w-full aspect-[790/1189] md:max-w-md mx-auto dark:-translate-y-0.5"
Expand Down
2 changes: 1 addition & 1 deletion src/pages/post/code-to-canvas.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ description: This is a post about how creating and developing a blog for yoursel
dateFormatted: July 7th, 2023
---

![Coffee and Code](/assets/images/posts/code-canvas.jpg)
![Coffee and Code](/portofolio/assets/images/posts/code-canvas.jpg)

Starting a blog as a developer is not just about sharing code snippets or technical tutorials. It's about sharing a piece of yourself, your experiences, and your unique perspective on the world of technology. Every developer has their own way of explaining things, and by putting your knowledge out there, you're not only helping others but also carving a niche for yourself in the vast digital landscape.

Expand Down
2 changes: 1 addition & 1 deletion src/pages/post/google-sign-in-flutter-supabase.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ description: This is a post about how implementation Google Sign In authenticati
dateFormatted: Juni 9th, 2024
---

![Coffee and Code](/assets/images/posts/flutter_supabase.jpg)
![Coffee and Code](/portofolio/assets/images/posts/flutter_supabase.jpg)

# Introduction

Expand Down
4 changes: 2 additions & 2 deletions src/pages/post/the-perfect-brew.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ description: This is a post about how creating and developing a blog for yoursel
dateFormatted: July 7th, 2023
---

![Coffee and Code](/assets/images/posts/perfect-coffee.jpg)
![Coffee and Code](/portofolio/assets/images/posts/perfect-coffee.jpg)

**Introduction**

Expand All @@ -17,7 +17,7 @@ Greetings, fellow keyboard warriors and design dreamers! ☕️ Ever wondered wh
2. **Ritualistic Zen**: The process of brewing, the aroma, the first sip—it's a ritual that centers the mind.
3. **Ambient Vibes**: The soft hum of conversations, the clinking of cups—it's the perfect white noise for concentration.

![Pour Over](/assets/images/posts/pour-over.jpg)
![Pour Over](/portofolio/assets/images/posts/pour-over.jpg)

> "Coffee is the common man’s gold, and like gold, it brings to every person the feeling of luxury and nobility." - Sheik-Abd-al-Kadir
Expand Down
4 changes: 2 additions & 2 deletions src/pages/post/vintage-tech.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ description: Embark on a nostalgic journey exploring the charm of vintage tech a
dateFormatted: July 27th, 2023
---

![Vintage Tech](/assets/images/posts/vintage-tech-01.jpg)
![Vintage Tech](/portofolio/assets/images/posts/vintage-tech-01.jpg)

**Introduction**

Expand All @@ -17,7 +17,7 @@ Hey, digital nomads and pixel perfectionists! 🌌 In our quest for the sleekest
2. **Digital Detox**: Vintage tech offers a break from the constant pings and notifications of our modern devices.
3. **Aesthetic Appeal**: Let's be honest, a vinyl record player just looks cooler than a Bluetooth speaker.

![Vintage Tech](/assets/images/posts/vintage-tech-02.jpg)
![Vintage Tech](/portofolio/assets/images/posts/vintage-tech-02.jpg)

> "In our rush to the future, we often forget the beauty of the past." - Yours Truly
Expand Down
4 changes: 2 additions & 2 deletions src/pages/post/writing-less-achieving-more.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ description: Delve into the art of minimalist coding, where simplicity reigns su
dateFormatted: July 27th, 2023
---

![Writing Less, Achieve More](/assets/images/posts/workspace.jpg)
![Writing Less, Achieve More](/portofolio/assets/images/posts/workspace.jpg)

**Introduction**

Expand All @@ -17,7 +17,7 @@ Hey there, fellow code artisans and design enthusiasts! 🌿 In a world obsessed
2. **Efficiency**: Often, the simplest solution is the most efficient one, both in terms of performance and development time.
3. **Aesthetics**: Just as a minimalist design pleases the eye, minimalist code is a joy to the developer's soul.

![Writing Less, Achieve More](/assets/images/posts/flowchart.jpg)
![Writing Less, Achieve More](/portofolio/assets/images/posts/flowchart.jpg)

> "Simplicity is the ultimate sophistication." - Leonardo da Vinci (Yeah, he wasn't talking about code, but it still applies, right?)
Expand Down
2 changes: 1 addition & 1 deletion src/pages/post/zen-mornings.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ dateFormatted: July 15th, 2023

Hey there, fellow code wranglers and pixel pushers! 🌅 Ever felt that mid-morning slump, right when you're diving deep into that new React component or finalizing a sleek UI design? Yeah, me too. But here's the thing: I've discovered the magic potion – a killer morning routine. And no, it's not just about brewing the perfect pour-over (though that's a part of it).

![Coffee Pour-over](/assets/images/posts/coffee.jpg)
![Coffee Pour-over](/portofolio/assets/images/posts/coffee.jpg)

**Why Morning Routines are the New Coffee**

Expand Down

0 comments on commit eebdba1

Please sign in to comment.