React Web App in Blogger with Claude and Deepseek

 React is new to me and so I wanted to learn it. I wanted to built and run web app here on this blog. This blog however is hosted on blogger(blogger.com). So I was not sure whether it will work. One can use codes like HTML, CSS and Javascript codes in one file. The blog posts are written within the blogger HTML/CS/JS container so no server is required. Also the code inside the blogger blog post or pages don't need the meta, head, body, header and footer tags. We can directly write the content inside the html body tag. CSS and Javascript scripts for web app are inside the same code as the html. 

So I was interested in knowing whether I can use react js inside the blogger blog  post and pages. To write the code I wanted to use Deepseek which I found to be better than chatgpt. Conversions I am not sure but for writing codes I found Deepseek better than ChatGPT. But I also had the Claude AI chat in mind. So today I wanted also compare which, Deepseek AI or Claude AI, better in providing solution to my coding questions. 

So there are multiple questions that I would get answer on. First the question of using React Javascript code in Blogger.com and then the question of which one provides better solution Deepseek or Claude.

The short answer is that one can use react with blogger. I tested it and the op-amp amplifier calculator is updated version that uses react js and the code was generated with Claude AI chat. I found that Claude produced better code than Deepseek. I used the free version of both. In particular I used Sonnet 4.6 model that Claude chat offered me as a default model. For deepseek there is no versions.

For comparison purpose, the following shows the screenshot of the original opamp amplifier calculator.

Original op amp calculator

Then I asked deepseek and claude to produce react based code with better UI interface look and the entire code should be in one single page. I provided them with the original code of the amplifier calculator. Below are screenshots of that had produced after one or two guidance chat with them. 

Deepseek 

deepseek generated op amp calculator

Claude

claude generated op amp calculator

So you can now compare the original, deepseek and claude generated calculator. Personally, I was impressed by the Claude version of the UI look and the source code. The black colored UI and the buttons etc looks much better. 

Both deepseek and claude produced codes and UI much better than I designed. I think both also cleaned the entire code spacing and removed unnecessary codes within the original code. Both were able to create react based code in a single file required by blogger. However, one thing I noticed about the functionality of the web opamp amplifier calculator, the deepseek version did not work. That when I clicked the calculate button nothing happened. I did not dwell into this since I already got the better claud version. So not only was I unhappy with deepseek created user interface(UI) look but was also disappointed with the functioning of the calculator. Maybe if I liked the UI look then I could have maybe also proceeded with deepseek correction of the calculating functioning but since of the look of the UI, I did not brother to dwell into deepseek solution.


Post a Comment

Previous Post Next Post