@GavinLon Жыл бұрын
I created this video to demonstrate a simple way to create a basic application that uses React for the frontend user interaction functionality and leverages a .NET Web API component that runs on .NET 6 on the server side. I hope you enjoy this video and benefit from it. A special thank you to FreeCodeCamp for sharing this video.
@robertoart5056 8 ай бұрын
This is not a simple way. why didn't use a string for the image, instead you used an id to grab images in an array then your using the image id to find an image, which if you have huge list of movies & album that will cause a memory leak. If your teaching people how to do it, then show them a simpler way so they understand.
@jaycanale4026 7 ай бұрын
I cannot find this template in my VS2022 version 17.8.4. Anyone know how I can obtain it?
@Koden 10 ай бұрын
Just a heads up, the source code is pointing to local SSL_CRT_FILE and SSL_KEY_FILE, so you need to change this when running it else it won't load. You, the user, will need to go in and change it to the directory of yours, odds are it's just changing the user ID.
@The_Ethical_Slacker Жыл бұрын
By and large this is a useful example, but be careful if you follow the vid too literally, because things appear in his code without explanation. For example, the "export default" statement at the bottom of RankItems. One minute it isn't there, the next it is. We don't see it being typed, nor is there any commentary to explain it.
@brianhathaway9580 Жыл бұрын
Yep, got an error on that too. No export
@esnatzea 5 ай бұрын
The Star Trek transition was awesome. Loved it.
@mattmjlg5053 Жыл бұрын
Y’all teach me more than my Software degree! Thanks code camp
@NguyenNam-ne8fk 8 ай бұрын
u sleeping at school?
@mattmjlg5053 8 ай бұрын
@@NguyenNam-ne8fk no brother! What I mean is you get a lot of more generalized info that you can read on google, and not as much applicable specific info that you might need in the industry
@Anubis2828 6 ай бұрын
Yea they only teach you about 5% of what you need in school
@felixkimutai8478 Жыл бұрын
Gavin Lon has been my teacher for the last 1 year and I must say I have learned a lot. Thanks Gavin and FreeCodeCamp
@nightwing09x Жыл бұрын
If anyone else gets stuck on Drop functionality not working, make sure you add .rank-cell, .row-label { width: 80px; text-align: center; display: flex; align-items: center; } to your custom.css file or else it won't work!
@asntube Жыл бұрын
I spent ages trying to work this out! Thank you! 🙂
@steve-ml2sv Жыл бұрын
Solved Finally, Thanks for your help! 😃
@chrisr2063 Жыл бұрын
i am befuddled as to why this was the reason and how this dude left it out.
@theneonlotus Жыл бұрын
You are my hero! Thank you!!
@Antonio63312 Жыл бұрын
needed this! Thank you
@twismfamily 6 ай бұрын
I'm using VS 2022 Community Edition and I don't have the same folders. I don't have the AppRoutes.js file in version 6. Was it moved or removed on an update?
@Ironlionm4n 9 ай бұрын
Good course, cant help but feel that the local storage portion of the course should have been more focused on working with the backend. Felt more like a React course with a pinch of .NET
@mattmjlg5053 Жыл бұрын
Wow so simple and short instead of over fluffed
@ammarmangala9814 Жыл бұрын
i've been praying for this! thank god my prayers have been answered.
@cseWorld 6 ай бұрын
This template is not found in my VS2022 version 17.9.1. How can i find it?
@ariansergi7929 4 ай бұрын
have you got any solution? i have the same problem
@GavinLon 9 күн бұрын
Hi. Before you start you must make sure that you have installed the ASP.NET and web development workload. You can use the React and ASP .NET core project template as described in this Microsoft Learn document - learn.microsoft.com/en-us/visualstudio/javascript/tutorial-asp-net-core-with-react?view=vs-2022 In this document it describes how to get started with the "React and ASP.NET Core" project template. A difference between the project template that I used in this video course and the one discussed in the Microsoft Learn article is that the client React code and the Asp.NET Core code are separated into two projects within the same solution. I just tried this template and everything works out of the box. I hope this helps.
@DMC3586 Жыл бұрын
Awesome!! This is exactly what I was looking for. Thanks a lot! Please more content like this.
@jetreject4719 Жыл бұрын
great tutorial overall, but... who uses var in javascript in 2023?
@DjangoBruh Жыл бұрын
This course would've been perfect if there was a db portion instead of hardcoding the objects like that, still a great course tho
@nnasim5089 Жыл бұрын
I ahve been looking fot videos like this too thanks man
@WoodyDataAI Жыл бұрын
Thank you Gavin, it is super great tutorials. so fabulous !
@mattpickel223 8 ай бұрын
This tutorial has been very frustrating for me. There a lot of differences in the templates, etc from when this was made (and he is still using class components??? not seeing those in ANY other current tutorials) and a bunch of the proxy stuff is different. It is a nightmare right now to figure out this proxy stuff to get my new Item endpoints to hit. They hitting in postman but defaulting to vite dev server in client. Additionally, the pacing and everything could be improved. A bunch of just dead silence intermittently.
@mahendranath2504 Жыл бұрын
Thank you so much 🎉❤🤝👏👍🤘🏻✌️🫰🏻🙏🏻😍
@9263STYV Жыл бұрын
Just wondering how to deploy this kind of project to azure? I tried to do it, but the page shows 500 internal error after deployment. Thanks
@daniborisov5957 Жыл бұрын
Thank you very much!
@AM180x Жыл бұрын
Hello I am on Linux, do you have setup instructions for Linux as it doesn't have Visual Studio 2022 available and only has VSCode?
@varunaggarwal7126 7 ай бұрын
vscode
@gds1233 Жыл бұрын
Exactly what I needed.
@lyafe1272 4 ай бұрын
FrontEnd Port: 44423 BackEnd Port: 7070 Also need to change export class d to export class Home in Home.js
@lyafe1272 4 ай бұрын
fetch is hitting the frontend port instead of backend port, and I am not getting data in frontend port. I added localhost + port number in fetch, I am getting another error now.
@user-ks9jj5tj8x Жыл бұрын
Does anyone can explain to me how the "item" reference in proxy.js file worked ?
@nicobost1950 10 ай бұрын
i have the same question... it's not working for me and i wonder why
@user-ot4zl1ii2z Жыл бұрын
how to use this with typescript? Should I install it using npm?
@ImadEz-zahi 6 ай бұрын
Amazing 👏
@pronavsandhu Жыл бұрын
great, a quick explaination of sql server data would have been great
@charlesdtrader8825 Жыл бұрын
More of this please.... finally
@JohnnysCoolStuff Жыл бұрын
When it launches a browser instance, javascript is disabled.
@ehsanafzal1589 Жыл бұрын
Its goings to be very interesting tutorial
@zanhbenz 3 ай бұрын
Do you know how can apply with NextJS?
@dieentdeckung Жыл бұрын
Great video! Only a few weird hiccups to get it launched & I plan on taking this project further from here! Curious why the drag/drop methods are using .substring(5) to get the moveIDs. Could anyone more knowledgeable maybe explain the practice here?
@Mikael_Puusaari Жыл бұрын
transferData.getData takes the id of the element, since it is in the drop function, when u drop in the rankingGrid it takes part of the id of the element starting from index 5, which is the number in the id (the id of the divs in the rankingGrid is something like "rank-4")
@sikoy4518 Жыл бұрын
Thank you so much
@RebeccaPeltz Жыл бұрын
Very helpful. I get a missing key error on the RankingGrid. I've tried a few ways to fix but not successful. Any suggestions?
@varunaggarwal7126 7 ай бұрын
This tutorial is not good(sry), you have not explained spa server, how dotnet middleware is interacting with react for routing etc, this is important even though you want to keep the time short, moreover that drop logic and lists of array you have added you have not explained it clearly, you seem like backend developer who only dwelled in some frontend.
@pratap4147 Жыл бұрын
Awesome thank you very much 😊
@gerrardxcc Жыл бұрын
why not stop using var in react ?
@minhduc8a21 Жыл бұрын
"Green screen" means a lot of things to me 😂
@kyong444 5 ай бұрын
Haha, I like that green screen!
@aniskadri140 Жыл бұрын
Merci
@nicobost1950 10 ай бұрын
More like "Mercy"
@nb664rbk Жыл бұрын
the intro 💀💀💀💀
@mrgippy123 11 ай бұрын
It's about 90% React and 10% .NET Web API. Its still a good tutorial though.
@spazn Жыл бұрын
(Solved) Does anyone else have an issue with refreshing the rank-items route? Everything works but if I refresh on the rank-items route, I get http 404 error, but I can refresh on the fetch-data, counter, and home route just fine.
@techz1511 Жыл бұрын
how did you solve this
@spazn Жыл бұрын
@@techz1511 I'm away on vacation ATM so i don't have it in front of me, but it had to do with changing the router that was wrapping the ,, with BrowserRouter I believe.
@clarkflavor 11 ай бұрын
@kwhandy Жыл бұрын
his background looks realistic, the sounds too. I wonder what kind of screencast software he use(?)
@techz1511 Жыл бұрын
I have a problem with loading the movies titles, any idea where i went wrong? I got to around 25th minute of the video
@varunaggarwal7126 7 ай бұрын
I used typescript with redux, it worked better than this spa server.
@bkcy18 Жыл бұрын
Can this be published to iis in the conventional way by creating a new site?
@RickSteadX 8 ай бұрын
wasted my time 👎👎
@DevEmpower Жыл бұрын
Hi. How we can be a member of freeCodeCamp and make tutorials?
@samuelallieu Жыл бұрын
I'm lost......hahahaaa funny me
@kimle9554 Жыл бұрын
like 1
@SayWhaaaaaaaaaaaaaaaaaaaaaaat 4 ай бұрын
NOT REAL DEVELOPER..USES BRIGHT THEME IN EDITOR.... ! :)
@vella166 Жыл бұрын
Chatgpt demotivating me to learn web or app devs at higher level😟😟
@bonk2935 Жыл бұрын
good
@risechess7114 9 ай бұрын
this is not professional work because u have to clean up the code before u start and why is that, i tell u when because i dont have proxy.js and when i start new project with .netcore and react i dont have the same front end as u . so if u are professional u have to clean the code so all starters whatever the version can apply as u did, so this video is just for first 3 month. and then its complete lost
@mswalsh68 5 ай бұрын
in .Net8.. its 2 folders for the project, a server and client, not 1 like shown here, but the proxy is found in the vite.config.js file on the client side this is all you have to do... scroll down and find where the weather proxy is.. and just add a new object to the proxy like I did here. server: { proxy: { '^/weatherforecast': { target, secure: false }, '^/item': { target, secure: false } },
@bazz6932 Жыл бұрын
First Comment
@thejezzi5219 Жыл бұрын
Really I feel so dumb. Even someone who lives in a forest is programming way better than me. EDIT: And he even has a pet dinosaur. What am I doing with my life 🤷♂
@isaacjon Жыл бұрын
Why's his vs code so ugly
@isaacjon Жыл бұрын
Soo light
@patrickminega120 Жыл бұрын
It's not vs code
@engineeringvision9507 Жыл бұрын
He's in a rainforest 😝😝😝
@prabhjotarora2740 Жыл бұрын
It's not vs code,its just vs! Vs is an IDE and vscode is an light weight editor!
@isaacjon Жыл бұрын
@@prabhjotarora2740 so what's the pros of this compared to vs code?
@chuck_norris Жыл бұрын
js is bloatware by design.
@thejezzi5219 Жыл бұрын
It is so weird to read your name first and then the joke.
@lawliet2263 Жыл бұрын
What is this
@thejezzi5219 Жыл бұрын
You call it a video. Young folks invented it but I dont think it's gonna trend for long.
freeCodeCamp.org
Рет қаралды 1,9 МЛН
Patrick God
Рет қаралды 119 М.