DevShop a Mern Ecommerce App MongoDB Submission

Basudev — Wed, 12 Jan 2022 13:41:39 +0000

Overview of My Submission

I Have Built an Ecommerce Store using MERN Stack with some basic Functionalities with Login Logout features, and Stripe Payment Gateway
This is Mobile Responsive Too
You can Login Register and make a payment

For Payments use test cards of Stripe

eg: 424242424242...,
Month: any month,
Year: Any Further Year,
CVV: any

Here is the Link to the demo app
demo

Frontend: Hosted On Netlify
Backend: Hosted on Heroku

Submission Category:

E-Commerce

Link to Code

Frontend

Basudev1 / ecom-frontend

Frontend for ecommerce app Built With React js

Getting Started with Create React App

This is a part of the Full Stack MERN app created for Mongodb Hackathon

This Project Contains the Frontend for the app, The Backend Can be Found Here Backend Ecom

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

`npm start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

`npm test`

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

`npm run build`

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready…

View on GitHub

Backend

Basudev1 / ecom-backend

Backend for ecommerce app Built With MERN Stack

Backend for MERN stack Ecommerce App Built on Top of Node Js, Express, Mongodb

This Project Contains the Backend for the MERN Stack Ecommerce App, Built for dev.to Mongodb Hackathon

This Proceject Requires Environment Variables

It has Stripe Payment
Mongodb URI
JWT Secret Token

View on GitHub

Admin Panel

Basudev1 / ecom-admin

Getting Started with Create React App

This is the part of MERN full stack Ecommerce App

This project contains the Admin Panel for the App

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

`yarn start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

`yarn test`

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

`yarn build`

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

`yarn`

…

View on GitHub

Additional Resources / Info

Used React JS for Frontend
Mongodb, Nodejs and Express for Backend

AMP Pages are half dead, Time to focus on Core Web Vitals

Basudev — Mon, 09 Aug 2021 07:24:55 +0000

The end has come to AMP pages and will be replaced with Core Web Vitals

If you work as a Full Stack Developer or have the ability to explore things that are involved with Search Engines and understand the user Experience and Optimize Websites for the users as well as search engines, then this post is for you

I have been Optimizing Websites for AMP Technology for a long time, where I used to work on the websites that produced news related content for the users and gained high ranking visibility in search engines, now things are getting changing and I have to focus on Speed and Performance of the websites rather than depending on AMP

What is AMP technology?

Accelerated Mobile Pages or AMP is an open-source HTML framework developed by Google, this technology is introduced almost 5 years ago
Its purpose was to optimize websites for better performance for mobiles

Why You should care
Earlier Google Forced Content Publishers to Use AMP for their Websites, Once your content is AMP friendly then google showed up the pages in the top news section, If you are a News Content Publisher or a regular Blogger,
writing and publishing content alone didn't help to get a higher ranking from search engines, to reach a higher audience AMP played a good role.

On April 19, 2021, Google Officially Announced that your Content should not need to be AMP for getting visibility in the Top Stories, and a few days ago Google removed the AMP icon from the pages of Top News Sections as well as search result pages, and bring an update of Page Experience which will effect at the end of August

problem with developers

AMP wasn't a challenging thing at all, if you work on a CMS like WordPress it was easier to make the website AMP friendly,

What if your Website or your Client Website is not on WordPress, and that was a self-made CMS or an E-commerce Store
in these cases, we have to face the challenges with AMP Technology

Challenges we faced

Custom JavaScript not allowed
Forms didn't Work Well
Separate subdomain for AMP pages
Problem with third party Advertising
AMP errors in Search Console

Now all these problems can be resolved by avoiding AMP as this Technology will no longer be able to add any value to your Websites and its the time focus on Developing websites that loads faster like this website Dev.to

what you should focus on

Focus on Core Web Vitals, learn more about core web vitals here https://web.dev/vitals/

Google Rolling an Algorithm update this year, which will effect at the end of August

If your website doesn't load fast then you will be a loser in the market, and its the right time to test your website for Core Web Vitals Eligibility and Optimize for Better Performance

hope you like this post, let me know your thought on Improving Website Speed and Performance

In my free time, I used to blog on Techncyber have a look

DEV Community: Basudev

DevShop a Mern Ecommerce App MongoDB Submission

Overview of My Submission

Submission Category:

E-Commerce

Link to Code

Basudev1 / ecom-frontend

Frontend for ecommerce app Built With React js

Getting Started with Create React App

This is a part of the Full Stack MERN app created for Mongodb Hackathon

Available Scripts

npm start

npm test

npm run build

Basudev1 / ecom-backend

Backend for ecommerce app Built With MERN Stack

Backend for MERN stack Ecommerce App Built on Top of Node Js, Express, Mongodb

Basudev1 / ecom-admin

Getting Started with Create React App

This is the part of MERN full stack Ecommerce App

This project contains the Admin Panel for the App

Available Scripts

yarn start

yarn test

yarn build

yarn

Additional Resources / Info

AMP Pages are half dead, Time to focus on Core Web Vitals

What is AMP technology?

problem with developers

what you should focus on

`npm start`

`npm test`

`npm run build`

`yarn start`

`yarn test`

`yarn build`

`yarn`