Trying to convert a jQuery MVC app into React Web Api App
-
Hi i am trying, but facing huge difficulties in converting a jQuery MVC app into React Web Api app, can somebody please help me, I though I can easily take all that's there in the convert easily into React but, i have come across lots of difficulties, one such is, importing css styles, and referring multiple css classes (in jQuery they can put multiple css classes in one element, but I am not able to do it in jsx files). Now I am just thinking, can i just put all those js files into a folder just reference them into my jsx files or components, can somebody please help me in this regards? How can I do it and what difficulties am I going to face, how can I call those methods within js files of jQuery into my jsx components, any help please - I would be very very thankful friends. I am also trying in my way by googling, reading online, asking friends and colleagues - but if anybody has faced these issues before could be helpful for me - thank you
-
Hi i am trying, but facing huge difficulties in converting a jQuery MVC app into React Web Api app, can somebody please help me, I though I can easily take all that's there in the convert easily into React but, i have come across lots of difficulties, one such is, importing css styles, and referring multiple css classes (in jQuery they can put multiple css classes in one element, but I am not able to do it in jsx files). Now I am just thinking, can i just put all those js files into a folder just reference them into my jsx files or components, can somebody please help me in this regards? How can I do it and what difficulties am I going to face, how can I call those methods within js files of jQuery into my jsx components, any help please - I would be very very thankful friends. I am also trying in my way by googling, reading online, asking friends and colleagues - but if anybody has faced these issues before could be helpful for me - thank you
I don't have much experience with React, for I chose Angular instead. Angular and React are similar in design and sort of the same. Last year, I tried to convert my website which I wrote in .Net Core MVC, Razor, JQuery and Mobirize over to Angular. I did what you are doing ... Many of the cool Mobirise effects were written in JQuery, so I thought it would be an easy conversion for me to rewrite these effects from JQuery to Modern JavaScript and include the JS files and call the functions. This conversion would also remove JQuery from my project and I would be JQuery free at last. So I started rewriting JQuery into modern JavaScript and got a few effects working. Then the hammer came down on me; and I realized that the conversions only worked on the first page load. When switching pages, my new effects did not fire or run; because there is no page load when switching pages in Angular. In other words, Dom Ready only exist on the first page load. The Angular router doesn't fire a DOM ready when routing is called. So all this work went out the window and I moved on to CSS. Next I worked on the cool Mobirise CSS styles, effects and animations. I wanted my project to be free of CSS, and chose SCSS instead, so I translated all of the Mobirise CSS into SCSS one style at a time and tested them and got good results. So I was finally ready to do a dump of all the old technology and go with the new technology to produce a clean project. I dumped JQuery completely, Went SCSS, and worked on my Webpack, node-sass and build or package.json file. My project was a mess and all the old technology that was removed left me with a basket full of holes or missing things. I fixed or replaced one thing at a time and got 95% of it working. So what did I learn? I learned that the old way of how a website works does not apply to technologies such as Angular, React and Vue. It's a totally different way of thinking, which includes how your Models are designed, getting more CRUD like in how you design forms and your API calls, and even down to database document designs. With efficient models, db documents, and even SCSS classes, you can really simplify a project down to the bare bones with very few lines of code and HTML. Now I have about 16 months experience with Angular V7+, SCSS, Webpack, npm packages, .Net Core V2.3+, modern JavaScript, TypeScript, MongoDB, NodeJS and I get it now. I'm in the process of adding a new store to my website as an experiment to test my skills before I write dedicated store on an
-
I don't have much experience with React, for I chose Angular instead. Angular and React are similar in design and sort of the same. Last year, I tried to convert my website which I wrote in .Net Core MVC, Razor, JQuery and Mobirize over to Angular. I did what you are doing ... Many of the cool Mobirise effects were written in JQuery, so I thought it would be an easy conversion for me to rewrite these effects from JQuery to Modern JavaScript and include the JS files and call the functions. This conversion would also remove JQuery from my project and I would be JQuery free at last. So I started rewriting JQuery into modern JavaScript and got a few effects working. Then the hammer came down on me; and I realized that the conversions only worked on the first page load. When switching pages, my new effects did not fire or run; because there is no page load when switching pages in Angular. In other words, Dom Ready only exist on the first page load. The Angular router doesn't fire a DOM ready when routing is called. So all this work went out the window and I moved on to CSS. Next I worked on the cool Mobirise CSS styles, effects and animations. I wanted my project to be free of CSS, and chose SCSS instead, so I translated all of the Mobirise CSS into SCSS one style at a time and tested them and got good results. So I was finally ready to do a dump of all the old technology and go with the new technology to produce a clean project. I dumped JQuery completely, Went SCSS, and worked on my Webpack, node-sass and build or package.json file. My project was a mess and all the old technology that was removed left me with a basket full of holes or missing things. I fixed or replaced one thing at a time and got 95% of it working. So what did I learn? I learned that the old way of how a website works does not apply to technologies such as Angular, React and Vue. It's a totally different way of thinking, which includes how your Models are designed, getting more CRUD like in how you design forms and your API calls, and even down to database document designs. With efficient models, db documents, and even SCSS classes, you can really simplify a project down to the bare bones with very few lines of code and HTML. Now I have about 16 months experience with Angular V7+, SCSS, Webpack, npm packages, .Net Core V2.3+, modern JavaScript, TypeScript, MongoDB, NodeJS and I get it now. I'm in the process of adding a new store to my website as an experiment to test my skills before I write dedicated store on an
I too understood that, i need to build the whole front end design from scratch with React. Another thing is, its not that whole project converting from jQuery to React, its a prototype I am trying to make. This project that I am working isn't a live project, its just a small prototype project I am doing now. Since the React and jQuery operates differently, conversion of jQuery or even using jQuery isn't an option in React, better to build it from the scratch. This is an with couple of pages for prototype to show how single page App works.
-
I don't have much experience with React, for I chose Angular instead. Angular and React are similar in design and sort of the same. Last year, I tried to convert my website which I wrote in .Net Core MVC, Razor, JQuery and Mobirize over to Angular. I did what you are doing ... Many of the cool Mobirise effects were written in JQuery, so I thought it would be an easy conversion for me to rewrite these effects from JQuery to Modern JavaScript and include the JS files and call the functions. This conversion would also remove JQuery from my project and I would be JQuery free at last. So I started rewriting JQuery into modern JavaScript and got a few effects working. Then the hammer came down on me; and I realized that the conversions only worked on the first page load. When switching pages, my new effects did not fire or run; because there is no page load when switching pages in Angular. In other words, Dom Ready only exist on the first page load. The Angular router doesn't fire a DOM ready when routing is called. So all this work went out the window and I moved on to CSS. Next I worked on the cool Mobirise CSS styles, effects and animations. I wanted my project to be free of CSS, and chose SCSS instead, so I translated all of the Mobirise CSS into SCSS one style at a time and tested them and got good results. So I was finally ready to do a dump of all the old technology and go with the new technology to produce a clean project. I dumped JQuery completely, Went SCSS, and worked on my Webpack, node-sass and build or package.json file. My project was a mess and all the old technology that was removed left me with a basket full of holes or missing things. I fixed or replaced one thing at a time and got 95% of it working. So what did I learn? I learned that the old way of how a website works does not apply to technologies such as Angular, React and Vue. It's a totally different way of thinking, which includes how your Models are designed, getting more CRUD like in how you design forms and your API calls, and even down to database document designs. With efficient models, db documents, and even SCSS classes, you can really simplify a project down to the bare bones with very few lines of code and HTML. Now I have about 16 months experience with Angular V7+, SCSS, Webpack, npm packages, .Net Core V2.3+, modern JavaScript, TypeScript, MongoDB, NodeJS and I get it now. I'm in the process of adding a new store to my website as an experiment to test my skills before I write dedicated store on an
jkirkerx wrote:
I'm getting out of software contracting
I am not into Contracting anymore buddy - I am an employee, but this is prototype app. It is not an enterprise app yet, this app isn't launched yet, it seems we need to write it from the scratch. The reason why I was going in that direction was, it has jQuery libraries which have click etc events written and reading all those and implementing them again I thought may take longer time, but actually if it takes let it, that's what it is. You know right reading jQuery is like more challenge, that's why mostly these readable front end scripts like React Angular came in. I too did around 6 months of work on Angular, but React is little different than Angular in terms of syntax etc but yes I feel routing was much similar except we need to import rounting explicitly.
-
Hi i am trying, but facing huge difficulties in converting a jQuery MVC app into React Web Api app, can somebody please help me, I though I can easily take all that's there in the convert easily into React but, i have come across lots of difficulties, one such is, importing css styles, and referring multiple css classes (in jQuery they can put multiple css classes in one element, but I am not able to do it in jsx files). Now I am just thinking, can i just put all those js files into a folder just reference them into my jsx files or components, can somebody please help me in this regards? How can I do it and what difficulties am I going to face, how can I call those methods within js files of jQuery into my jsx components, any help please - I would be very very thankful friends. I am also trying in my way by googling, reading online, asking friends and colleagues - but if anybody has faced these issues before could be helpful for me - thank you