DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 966,904 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for How did I build πŸ—οΈmy first πŸ—„οΈAPI with MongoDB and Next.js?
Abhay Prajapati
Abhay Prajapati

Posted on

How did I build πŸ—οΈmy first πŸ—„οΈAPI with MongoDB and Next.js?

By the way, I am a frontend developerπŸ§‘πŸΏβ€πŸ’», I always love to use APIs and work with them.
but the project that I was wanted to build API is like Apple's 🍎 Store,
and this gave me the will to build an API and release it,
A few weeks ago I completed working with my Clone Of Twitter Project, where I had used **Firebase **as a database,
but now I wanted to push myself and use **MongoDB **as a database.

After thinking a while I start with the project's building

Open source Apple Store API.

using Next.js API Routes it has become very easy to manage the backend.
I make simple routing and pages so if the comes to this page will be provided with other these data.

BaseUrl : https://oas.vercel.app/api

/all

baseUrl /all
ThanosInfinityWarGIF.gif

it provides all the data from the database, from all the categories without filteration. 😊

/category/:category

baseurl /category/iphone

PhirHeraPheriBCategoryKeCClassLogGIF.gif

here you can add category for your output. and result will be from that category only.
example: + /category/watch
+ /category/iphone
+ /category/macbook
+ /category/airpods
+ /category/ipad

/series/:series

baseurl /series/MacBook Air
πŸ§‘β€πŸ’»every product has series name such as iPhone 13 has series name such as iPhone 13, under iPhone 13 two products come iPhone 13 & iPhone 13 mini.

They are case sentitive πŸ˜“ so iphone_13, iPhone_13 won't work ❌,
correct way /series/iPhone 13 βœ…
without %20

/:_Id

baseurl /6228d7ac2e00fb1164b2df27

DoYouHaveIdWhoAreYouGIF.gif

for getting results realted to single product the /:_Id is used.
example: /6228d7ac2e00fb1164b2df27,
these are id sentitive fetch with their respective id's.πŸ˜…

{
    "data": {
        "_id": "6228d7ac2e00fb1164b2df27",
        "product_name": "MacBook Pro",
        "product_price": {
            "IN": 109000,
            "US": 999,
            "GBP": 899
    },
    "product_description": "Id culpa aliquip ipsum excepteur sunt incididunt laboris magna incididunt nostrud.",
}
}
Enter fullscreen mode Exit fullscreen mode

CatDrivingGIF.gif

This is how I worked πŸ’ͺ🏾on routing/ and requests.

use this project and let me how was it, I'll your projects' in the featured section.

Share 🀝🏾 you ideas thought's regarding this I try to implement that.

BusinessmenHandshakeGIF.gif

Connect with on
Twitter : @AbhayPrajapati_
Github : @theabhayprajapati
πŸ‘‹πŸΎ

Top comments (0)

🌚 Turn on dark mode

πŸ”  Change your default font

πŸ“š Adjust your experience level to see more relevant content

Head to your account's Settings to do all this and more.