Issue #1 - Migration from pages router to app router

[OneRandom1509]

Migration to App Router

This pull request addresses issue #1 by migrating the Nex music player application from the "pages router" to the "app router." This change helps us take advantage of the latest Next.js features and improves the overall maintainability and performance of Nex.

In this process, _app.tsx and _document.tsx have been merged into layout.tsx file in the root directory of the app folder, and 404.tsx has been replaced with the new convention - not-found.tsx. Some components have been added with use client; directive in order to use the new router() router instance and usePathame() function from next/navigation instead of the old router instance from next/router, both of which can only be used in the client side.

In addition to the migration, the SEO page has been replaced with the new built-in Metadata API to export metadata easily inside the app router.

Every page inside the app router has been split into two files - layout.tsx and page.tsx. layout.tsx is where every client side operation takes place and page.tsx is where server side operations take place. For now, the only server side operation in page.tsx files is the export of metadata using Metadata API. A void function has been written in order to bypass the error of not exporting a react component in the file. This void function can be used for future server side features as well.

Screenshots

The improved not-found page

[OneRandom1509]

The new commits have made all the pages to be server-side and components to be server-side, except the sidebar and the carousel as it needs the user interactivity in order for it to work. All the above commented required changes have been made in a proper manner too.