Create A React App Without Create-React-App

[@adarsh-chakraborty]

Now i appreciate CRA even more 😐

[@weirddev]

Start using vite, you will hate cra more

[@weirddev]

@Sadik.H no 😐

[@mohanrajmuthukumaran8513]

CRA will also left u with some vulnerable packages too 🙃

[@belvss896]

Don't use CRA.

[@sahilyadav3782]

@@weirddev I'm really confused why do we not see Vite nearly as much as CRA, like, it's pretty simple and so much faster

[@882caio]

Fala Pedrão!!! Excelente vídeo continua assim que seu canal vai crescer cada vez mais (Tenho certeza que você é BR).

[@PedroTechnologies]

Obrigado Caio! Sou br sim kkkkkk

[@mikaio]

Preciso em

[@ninel-valentin]

Google sent me to your video. It helped a lot. Even as a begginer I have understood everything and I loved it! It is right what I needed for my project! Cheers!

[@pgtips4240]

I have done several tutorials on React and a lot of them fail for different reasons but his one has worked completely. I feel I have learned a tonne about how react hangs together. Also having the source on git helps immensely. The only thing I had to do differently was in the webpack.config.js I had to also set entry: "./src/index.js" as it wasn't finding the index.js file. I don't know why it was different for you?

[@anshumanxda]

I did without create react app, i did with vite🤣

[@edward-soli]

Keep it up buddy😂😂😂

[@JD-sn1lr]

When I ran the app, I got an error "Can't resolve './index.js' in C:\Development\React eact-from-scratch". I modified the webpack.config.js entry: "./index.js" to entry: "./src/index.js" and that fixed the error.

[@cortarelva]

"The thing that takes the most amount of time is understanding everything"! Aint that true!

[@gooddogreallygooddog6157]

i have been searching for this exact video for the past week

[@samueltadesse2158]

Thank you so much CRA was not working for me for a week no matter what i did. truly a godsend.

[@KryptechOfficial]

Thanks a lot!! But it seems like you forgot to add all of the Babel-related packages into the description like you said you would, so that would be a great addition!

[@nehat786]

I was confused with this but you clear it out everything. Thanks

[@zaidali1107]

Brilliantly explained 🔥

[@PedroTechnologies]

Thank you 🙌

[@L8rCloud]

In your “rules:” your RegEx statement only tests for the .js OR .jsx extension YET you also have the .json and .tx extensions listed. Shouldn’t they ALSO be added to your RegEx statement for testing…?

[@AllNaturale11]

This isnt working for me. When i run npm build I get an error in ./src/index.js and that the module build failed. I also have an error that says ./index.js cant but resolved. What can I do to fix it?

[@mirkafarkasova2425]

Great video man, as always. I am just having some issues. Like for example, the console is flooded with Source map errors. Any idea why?

[@anithadharaneedharan6758]

Thanks a tonne for the video, saved my day

[@djoezi3662]

Amazing! Thanks a lot man, you are doing best!

[@mohammed.haydar]

Would love to know how u got auto-completion in your bash terminal?

[@PedroTechnologies]

Fig ! Great software

[@CoderDmitri]

ty so much for this, you are a legend!

[@edwardhandrich6043]

I wish I could like this video twice. I have a new interview question, "can you create a react app, without running create-react-app?'

[@sashaikevich]

I'm happy to follow you along, but where do you get your info? ( I'm thinking for when one of the packages ultimately changes, where can I get the latest presets config, without hoping you'll post a timely video) Thanks!

[@PedroTechnologies]

I follow the react team on twitter and I always check the react subreddit!

[@sashaikevich]

@@PedroTechnologies gotcha, thanks. See you on teh subreddits then!

[@valeriousmonk654]

Great video! Thank you! Interesting to see same with snowpack ))

[@dmytronice1337]

Starting from React 17, you don't need to Import React for using JSX syntax in files. So how we can do it with webpack ?

[@WitOfGray]

God bless you fam❤️🔥

[@siddheshshirawale4575]

I like your videos. Your videos are very helpful. If possible make video on next js + rich text editor .

[@CoderDmitri]

I was getting CAN NOT resolve MAIN.js error, I solved it with modifying MAIN.JS path in webpack.config.js, so it is now: filename: "./public/main.js", as oppose to "main.js" ... it works now

[@kalahari8295]

Finally 😌❤️🔥

[@Messi2Inno]

Hey! Pedro, you mind doing a video with golang as backend and react as frontend with SQL database??

[@aleatennu383]

Is it possible to reuse all this in another react project?

[@bopon4090]

This is the best way to learn webpack.

[@rmaheshchalke]

@PedroTech I am not able to run your project, it showing error e.g. 'webpack-dev-server' is not recognized as an internal or external command,

[@rmaheshchalke]

Sorry, i have deleted existing node modules folder and i have installed again and it is started working but still with react 18.2.0 it is not working, is there any other solution?

[@MrFuma-fr8no]

Hey PedoTech, love your channel. Your React Router video is *chef's kiss*. I have been scouring the web for this answer but to no avail. In React, should I use js or jsx at the file extension? Is there any difference to it? I would love your input! Obrigado!

[@PedroTechnologies]

Thank you! There is no difference between them! It is purely for organization. In my prev company they used jsx for react components and js for normal files

[@MrFuma-fr8no]

@@PedroTechnologies Thank you! I am a beginner in Web Dev. When you say normal files, are we talking about JS files with only regular JS in it? And as soon as you mix HTML and JS it should be jsx, right?

[@theawes0me0ne]

@@MrFuma-fr8no ive seen people do exactly this yes

[@internetexplorer7880]

When you suffix your files with .jsx, you get autocompletion for html tags which you don't get when you suffix it with .js

[@TarekFaham]

Fantastic tutorial! How you can develop parts of the application features using this method and integrate it with an existing application that is based on angularjs? For example, there are a lot of forns which are build using a designer of some kind. I can insert an HTML component and add the script tag to reference the script main.js. But how to render the correct section when the specific form is active?

[@zlatkoiliev8927]

Please create one tutorial with typescript and styled components! Please! :)

[@lucasa8710]

parabens mano, pelo vídeo e pelo seu ingles, muito bom

[@ThColinPereira]

This is so cool!

[@efemenaekagha3406]

I ran into an error saying field browser doesn't contain an alias configuration

[@daniel7007]

GReat video! Bro where did u find all buble dependencies?

[@timothydoan2]

Please make a vid on real time chat app with react and firebase. Like a discord clone.

[@CoderDmitri]

also, you need to do: npm i react react-dom --save-dev to install react, otherwise does NOT work

[@azumatomlinson3474]

my css didn't work properly, I had to add this under rules in webpack.config.js { test: /\.css$/i, use: ["style-loader", "css-loader"], }, and also install these dependencies: npm install --save-dev style-loader css-loader

[@imchiennb]

How to make powershell auto-suggestion like this?

[@SaptarshiMajumdar]

Great video but how do I incorporate CSS files?

[@shashwattulsyan8522]

can you please make a separate tutorial for how to store fields and files in mongdb(MERN).

[@devstuff92]

New sub, love your videos already! Can you make a tutorial on how we can implement audio sound effects(for example onclick or any other events) using react? I would appreciate it

[@wziro65]

thanks man!

[@contrav8349]

i want to know the commands in windows

[@hichamabh6280]

this is better than cra, cause is more understandable

[@ahmadgazzz]

Now create a react app without using react

[@k4qdex]

you forgot to include react refresh...

[@imonw3b]

I think, you forgot to add .gitignore and put /node_modules so it won't be push on github. Anyway, good tutorial!

[@faris.abuali]

🤦🏻😢 Thanks Pedro!

[@Katoph]

Let’s go

[@randerins]

Transcendeu 🤯

[@Quand101]

Cool

[@nimitindrasoni]

showint error :( \learnings eact-corpsite ode_modules\webpack-dev-server\lib\servers\WebsocketServer.js:10 static heartbeatInterval = 1000; npm ERR! code ELIFECYCLE npm ERR! errno 2 npm ERR! react-corpsite@1.0.0 start: `webpack-dev-server .` npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the react-corpsite@1.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in:

[@coffee-is-power]

Don't use cra, it's outdated, use vite instead, it's much faster and has much better DX

[@chukasin]

How