🚨 IMPORTANT:
Checkout Frontity: https://bit.ly/frontity-webdevsimplified
Frontity is an incredible tool for creating headless WordPress sites using React. It takes all the pain of dealing with PHP and WordPress directly and wraps it up into a nice and easy to use container. In this video I will show you how to use Frontity to create a simple WordPress theme with React and also how to use React Spring to add custom page transitions to your WordPress site.
📚 Materials/References:
GitHub Code: https://github.com/WebDevSimplified/Frontity-Blog
🧠 Concepts Covered:
– How to create a Frontity site
– How to add page transitions in Frontity
– Why React is so much nicer to work with for WordPress themes
🌎 Find Me Here:
My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified
⏱️ Timestamps:
00:00 – Introduction
00:41 – Demo
01:13 – Create Initial Project
04:50 – Frontity Packages Explained
08:45 – Most Important Components
09:44 – Modifying Styles
10:43 – Page Transitions
15:19 – Deployment
18:22 – Outro
#Frontity #WDS #HeadlessWordPress
source
I have a question: I can't find the public folder as we have in react for static elements like images.
ok … good tutorial but was hoping to see this working along with wordpress…. how come you did not show that functionality???
I am sure we cant use this framework for custom customer panel in our wp
Honestly, great video!
Its like Chisel/Twig, but sexy…
Can this work with page builders like elementor?
Bro, I have install frontity chakra theme but not displaying any images
How much do you love saying Frontity a bunch of times, hahaha!
Why this guy always bashes older tech stacks ??
Frontity is honestly underrated…
This channel deserves 5M subscribers
Seems complicated, why not just stick with a WP theme?
If you are getting Internal Server Error on the React Spring section is it because React Spring released a new version and the code in this video no longer works for the page animations part.
I found the answer to solve this on the React Spring GitHub:
"Yzrsah commented 27 days ago
@tim-soft
The API for useTransition changed in V9 but it's not documented on react-spring.io.
If you make these changes, it will resolve the issue.
Remove the key selector from useTransitions(), as it's now automatic:
const transitions = useTransition(toggle, null, {
to
const transitions = useTransition(toggle, {
Call transitions instead of mapping it:
transitions.map(({ item, key, props }) => …)
to
transitions((props, item, key) => …)
@joshuaellis The issue is just a documentation issue.Yzrsah commented 27 days ago
@tim-soft"
Great video man. Thanks for your work.
how do you import this theme into WordPress?
i mean – how do you make your custom themes appear in the list of themes in WordPress dashboard?
I hope you have time to reply. I have a set of users. And their data stored in my db. I want to offer a way to create a uniqe one pager . So basicly they just press a button. That then gets the info from the database, and then automaticly generates a new wordpress site. Is this possible with this? How would i get started ? Im at a loss , since there is not much info about this
I wonder if this is sponsored video by vercel or Frontity .
Do you recommend using this headless cms architecture with wordpress+woocommerce?
Wow Kyle! you have content for many areas, bravo!
Adding my wordpress to the source section just leads to a 404… In fact, adding wp-json to to the end of my website doesn't lead anywhere. Help!
I just had one doubt, using frontify we can deploy react apps to WordPress but can we use the drag and drop feature of WordPress to modify the UI?
Make a wp theme with acf and cpt
Do you have availability for building a Gatsby + WordPress theme for me? I want a solution for mass building small websites using Airtable data.
dude I'm so excited to use this, but it seems fairly new so I'm still worried about stability and bugs…
after doing freelance work for a while I've just come to accept there's no faster and better value/time platform to use other than wordpress, but I just really hate the custom theme process and working with PHP, it's a big pain in the ass for me. A theme in WordPress that takes me 3 days to make would take me half a day with React because I'm much more used to it (and used it a lot with Nextjs too).
Honestly, great technology.
Do you have to deploy the project every time a user adds or changes content in the wp backend?
2:02 On a Frontity sponsored video*
Frontity: "Do you want to see updates about Frontity?"
Kyle : "No"
Frontity: "Am I a joke to you?"
can it combine with plugin like woocommerce?, what is this have a dashboard in wordpress backend?
Would love a whole video on react-spring!
Kyle are you familiar with Strapi? can you make a video about it?
Amazing!
Try making a Laravel App. I bet you never knew how to make one!
More info: https://laravel.com/
Bro can we sell digital product using HTML, except WordPress.
If you know make a video
Please reply me
When using this headless set up with wordpress what are the pros and cons vs a regular wordpress site?
Thanks Kyle, this was super useful
front titty huehuehuehuehuehuehuehue
This is one time following instruction that I can build it successfully on my localhost. Thanks Kyle so much. Last time I spent a bund of time to watch a series of videos of another guy. But I couldn't build it successfully and I saw my comments from his channel said them same. Kyle, you did a great job. I am a WordPress developer and I am learning React. This topic attracted me so much. So I decided to learn Mastering React course from Mosh Hamedani. Thanks a lot for your video!!!
Please build one homework sharing website like Google classroom .
like this if you also want him to make this.