Get Started with ReactPress

Рет қаралды 16,219

Күн бұрын

Update: Check out the new tutorial at: rockiger.com/en/reactpress/re...
This video shows you how to get started with ReactPress:
1. Create a new WordPress site in LocalWP
2. Install ReactPress on your local WordPress installation
3. Use create-react-app from the command line in the apps folder shown in ReactPress
4. Reload ReactPress page and give the app a slug
5. Build the app
6. Develop your React
7. Re-build
Local: localwp.com/
ReactPress: wordpress.org/plugins/reactpr...

Пікірлер: 47

@OvidiuTrif 2 жыл бұрын

Thanks for this guide and ReactPress ❤.Thank you also for the link to Localwp 🥳

@aaronkingcto 2 жыл бұрын

Great video, thank you!

@kirtyrov2636 2 жыл бұрын

Hi, thanks and continues lessons about custom plugins, themes development on WordPress.

@든든한국밥 8 ай бұрын

Thanks for your kind guide video

@kangte2460 2 жыл бұрын

Geniunely thankyou sir ❤️ I am from India and have a poor background and i really wanted wordpress and react combination I hope this is really gonna help us a lot again Thank you soo sir ❤️

@MarcoLaspe 2 жыл бұрын

Your welcome.

@jam-fam Жыл бұрын

great work! thank you for developing this plugin. Is there no way of using Reactpress without using local host, e.g. on the reactpress admin allow users to press a button to create a new react app which will then import/add files to whatever folder you name it, in your example 'demo' . Then when users wants to edit their app, they can simply go to the file manager, open the demo folder and edit their App.js file?

@MarcoLaspe Жыл бұрын

Unfortunately this is not as easy as it seems. ReactPress had some similar behavior in the past, but it is to error prone. You need a nodejs environment on the server, certain PHP functions that are often restricted for security reasons and so an.

@monikalombos2392 10 ай бұрын

Hey guys! I am wondering is it possible to assign an external server url for a POST HTTP submit form with reactpress to call a completely another url? Like proxying the whole submit POST HTTP request to a backend server. If yes, how?

@MarcoLaspe 10 ай бұрын

Sure, it is a standard React app. There are no special restrictions.

@davetinoco Жыл бұрын

I followed this exactly up to the point where you install the new project. But when I refresh the WP admin page, it never recognizes the new project in the apps folder. Any idea what the problem could be?

@MarcoLaspe Жыл бұрын

Did you build the project first? You need to build the React app first.

@bijanrajaie710 2 жыл бұрын

Hi, How do I pull down a pre-existing Wordpress press site to local? It is hosted by host gator.

@MarcoLaspe 2 жыл бұрын

What do you mean with pull down? There are plugins for exporting sites. If you want to develop an React-app downloading the theme should be fine.

@ysl8589 8 ай бұрын

Hello Marco. I saw your good video. I built a react app in wordpress by referring to your video, but the image path is different and the svg file is not visible. In your video, it seems that the image file was not created separately but in the path in the src and public folders in the app folder. Is there any way to solve this problem? Do you know?? I am currently creating an app using wordpressd and fileFilla using an external cloud.

@MarcoLaspe 8 ай бұрын

It seems your build path is not set properly. Have a look at rockiger.com/en/reactpress/understanding-reactpress/#gf4adf51aa73b

@Administrator3831 Жыл бұрын

Everything worked out for me except opening media files, photos and videos does not open both in the local and the site. What could be the reason ?

@MarcoLaspe Жыл бұрын

Probably the build path is not set properly. Did you use an existing app, or did you make a new app with create-react-app?

@Administrator3831 Жыл бұрын

@@MarcoLaspe If I can solve this problem, can I assume that in this way the site will open faster than the traditional version of WordPress?

@MarcoLaspe Жыл бұрын

@@Administrator3831 I don't understand what you mean. Why should it open faster? You would have a single page app embedded into a WordPress page.

@oluwapelumibalogun5061 Жыл бұрын

Please someone help, what command line did you use? I can't seem to access the first directory using the command prompt. I've been on it for days now. Please help 🙏

@MarcoLaspe Жыл бұрын

I use the command line from my Linux Distribution. What system are you using? Maybe it makes sense to post a support request at wordpress.org/support/plugin/reactpress/ wordpress.org/support/plugin/reactpress/

@oluwapelumibalogun5061 Жыл бұрын

@@MarcoLaspe I'm using windows, I later had to use the command line interface of the local sites.

@nguyenthanhnam1036 Жыл бұрын

Hei, thanks for your work! I am struglling to get to "path-to-your-wordpress-root" from command line. I tried using WP CLI and basic command line and it doesn't work. The error is "Cannot find path 'C:\home\"My username"\public_html\wp-content eactpress\apps' because it does not exist". What should I do to get to my wordpress root file. Thanks very much!!!

@MarcoLaspe Жыл бұрын

It seems like a weird problem with Windows path delimiters. This is a PHP issue. I suggest using LocalWP as a test environment for WordPress - it's free and effortless to use. Generally, I would advise against Windows as a dev machine, and recommend Linux instead - but that is only my opinion.

@nguyenthanhnam1036 Жыл бұрын

@@MarcoLaspe thank a lot sir !!!

@nguyenthanhnam1036 Жыл бұрын

Hi @Marco Laspe! I did what you said and everything was good until I deployed reactapp to my live wordpress web. Steps that I did: 1. Create reactapp in command line, by Local 2. Add slug, make changes to test, run build (It worked as I wish) 3. Install reactpress in my live wordpress website 4. Create a folder (in cpanel) with the same name of my react app, upload build file to this folder 5. Turn back to reactpress, add slug and...nothing appears when I click to the slug (error: "There has been a critical error on this website.") I dont understand your guide "...upload the build folder of your React app into the app directory and that you have the same folder structure in your dev and live wordpress installation..." My local link to deploy reactapp is - C:\Users\HP\Local Sites eactapp1\app\public\wp-content eactpress\apps My live web link to deploy reactapp is - home/"my username"/public_html/wp-content/reactpress/apps/[appname] Did I miss understand some point of your guide? Thanks a lot for your time!

@nguyenthanhnam1036 Жыл бұрын

Can you make a video how to deploy react from local wordpress to live wordpress. I saw your video for deploying. However, as I understand, you uploaded the reactapp to an local web, not a live web. Thank sir!

@MarcoLaspe Жыл бұрын

@@nguyenthanhnam1036 There isn't any difference, instead of copying the file on your machine, you copy it to a live server via ftp. Check out the documentation: rockiger.com/en/reactpress/getting-started/#deploy

@James-wq8ui Жыл бұрын

Hi, I'm trying to add a nextjs project onto my site but it doesn't seem to be working. I've tried the standard react build and that works fine. Is there anything I need to do differently? The project I'm trying to use is kzfaq.info/get/bejne/mphmpc19vdCznqc.html - github repo in desc.

@codingmutant9066 8 ай бұрын

what does this do? i dont get it.. what is the benefit of this?

@MarcoLaspe 8 ай бұрын

You can embed a single-page application right into any page of your WordPress website.

@jesssilvasp Жыл бұрын

my localhost don't open in the react page in 5:50 of vídeo. I followed the steps but the page is blank

@MarcoLaspe Жыл бұрын

If the index.html is empty, the cause is usually insufficient access rights. Your WordPress/PHP must be able to access the URL of the page where your app embedded. This is often a problem with Docker configurations. Another reason could be some error during writing if PHP doesn’t have the capabilities to write files. What LOCAL environment do you use?

@jesssilvasp Жыл бұрын

@@MarcoLaspe the field was empty anyway, I already managed to correct it. thx 😊

@jesssilvasp Жыл бұрын

@@MarcoLaspe Would it be possible to make an updated Reactpress tutorial? I couldn't find any more videos about reactpress

@MarcoLaspe Жыл бұрын

@@jesssilvasp If you don't mind a written tutorial. There is a brand new one at: rockiger.com/en/reactpress/reactpress-tutorial/ I will probably create a new video version when I have the time. In the meantime, the written one is your best option.

@jesssilvasp Жыл бұрын

@@MarcoLaspe okay, thank you!