The world of modern web development was SPAs like Angular, React and Blazor. Now customers are choosing Next.JS and shadcn/UI – these tools are revolutionizing how we build on the web. This beginner-friendly session will guide you through the process of creating sleek, responsive websites with ease and confidence.

00:00 Intro
01:29 JavaScript Ecosystem
06:36 What is Next.JS + Shadcn/ui?
17:00 Setting Up a Next.JS Project
29:50 Building Components with Shadcn/ui
37:41 Forms
48:15 Further Resources
50:08 Q and A

Join Jack Pettit, a Software Engineer at SSW who loves working on TinaCMS. He will guide you through the foundational steps of using Next.JS, a React-based framework known for its efficiency and scalability. Experience the seamless integration of shadcn/UI, a user interface toolkit that transforms complex coding into a visually intuitive process.

Expect a blend of practical demonstrations, real-world examples, and insider tips about secret sauce you can use in your web development. By the end, you’ll have a solid understanding of Next.JS and frameworks to supercharge your next web development project.

Links: Need help? https://www.ssw.com.au/consulting

Follow us:
LinkedIn: https://linkedin.com/company/ssw/
Twitter: https://twitter.com/ssw_tv
Facebook: https://facebook.com/SSW.page
Instagram: https://instagram.com/ssw_tv
Tiktok: https://www.tiktok.com/@ssw_tv

Get in touch: Jack Pettit – SSW Software Engineer
https://www.ssw.com.au/people/jack-pe…
https://www.linkedin.com/in/jackdevau/

For more information about SSW’s consulting services, please visit https://ssw.com.au/

#WebDevelopment#Nextjs#React#shadcnUI#ModernWeb#SPAs#Coding#WebDesign#SoftwareEngineering#TinaCMS#TechWorkshop#WebDevTips#FrontendDevelopment#WebDevCommunity#JackPettit#SSW#DeveloperTools#CodingJourney#LearnToCode#TechTutorial#WebDevBootcamp#BeginnerFriendly#CodingLife#UIUX#WebDevSecrets#TechInnovation

V2 – Bahjat

About the speakers

About the speakers

Jack Pettit

Jack is a Software Engineer based in the SSW Brisbane office, with a specialization in frontend development using React. He is also adept at backend development, adhering to the clean architecture pattern with .NET.

Beyond this, Jack has expertise in NextJS and Gatsby, always aiming to develop swift and responsive websites to ensure the best user experience. His skills extend to mobile development, having crafted mobile apps with Xamarin and now transitioning to .NET MAUI. A strong advocate of DevOps, Jack is well-versed with GitHub Actions and Azure services.

Related videos

Related videos

Treat Your Code Like Uranium | Adam Cogan

Adam Cogan shares a striking story comparing two World War II factories—one ordinary, one handling uranium—and the surprising lesson that the uranium workers lived longer because they followed disciplined, risk-aware practices. He connects that idea to software teams: the best outcomes come from careful habits like automated tests, telemetry, pull requests, retrospectives, shared rules, and good tools. The message is simple: treat software delivery with the same respect as dangerous work, and you’ll reduce stress, avoid chaos, and get better results.

3 Tips for Better Video Recordings | Adam Cogan

Great coaching can dramatically improve how you present, communicate, and learn. In this video, Adam Cogan shares 3 practical coaching tips that SSW uses every day—from onboarding and role plays to improving video delivery. He explains why having a coach matters, why immediate interruption beats delayed feedback, and how repeating corrections helps lock in better habits.

TinaCMS + Fumadocs: Bring Visual Editing to Your Docs | Hark Singh

Discover how to connect Playwright with AI agents and unlock powerful workflows.

Stop Using 👍 Wrong in Teams | Adam Cogan

A quick communication tip from Adam Cogan: don’t use 👍 as a catch-all response when someone assigns you a task in Teams, Slack, or Google Chat. In the example Adam gives, if a task will take about five minutes, a thumbs up is too ambiguous because it does not clearly say whether you’ve read it, agree with it, are doing it now, or will do it later. Instead, use 👍 for agreement, 👀 to show you’ve seen the task and are actively working on it, and then replace 👀 with ✅ once the task is done. It is a small change, but it removes ambiguity and cuts down unnecessary follow-up messages.

How to record a done video in SSW | Sylvia Huang | SSW Rules

Sylvia Huang from SSW shares her SSW Cultural Exchange experience from Hangzhou, China to Australia

4 Essential Sales Tips for Engineers | Adam Cogan

Not a salesman? No problem. Adam Cogan shares 4 practical tips to help engineers navigate sales meetings with confidence. Learn how to stop “selling” and start solving, how to talk numbers without the awkwardness, and why being transparent about your process wins more clients.

Do you explain why you’ve deleted or updated an appointment? | Adam Cogan | SSW Rules

Ever wonder why a meeting was moved or cancelled? Adam Cogan explains the “Secret Ingredient” to professional scheduling: always include a version history and reason for change at the top of your appointments. Improve clarity, keep a record of changes, and hold participants accountable with this simple SSW Rule.

Chat first before changing others’ code | Adam Cogan

Changing someone else’s code? Don’t just dive in! Adam explains why it’s important to check the source history and talk to the original developer before making changes. A quick chat can save headaches and keep everyone on the same page. Perfect advice for devs working in teams!

SSW TimePro – Create a new tenant | Jeoffrey Fischer

Learn how to provision a new tenant in TimePro and sync it with an external Dynamics 365 CRM system.

How to Report Bugs in Seconds | Brady Stroud

Tired of tedious bug reporting? Watch how Brady uses YakShaver.ai to turn a quick screen recording into a professional PBI instantly.