Alright, let's get everything ready before we dive in. Here's what you'll need:

• Node.js and npm: These are essential for running the development version of your Next.js app and installing dependencies.
• Google Firebase CLI: Install it using npm with this command: npm install -g firebase-tools.
• A Firebase project: Sign up or log in to Firebase and create a new project in the Firebase console.

First things first, let's create a new Next.js application. Open your terminal and run npx create-next-app@latest. Follow the prompts to set up your new app.

Once your Next.js app is ready, navigate into its directory with cd your-project-directory. Then, initialize your Firebase project by running firebase init. When prompted, select Functions and Hosting. Choose the Firebase project you created earlier. Pick JavaScript as your language, and say 'yes' to using ESLint.

For the hosting configuration:

• Public directory: Type “build”
• Single-page app: Answer “No”
• Auto build and deploy before each deploy: Answer “No”

This will create a functions directory and some configuration files.

To enable server-side rendering, you'll need to set up a Firebase function. Write the following code inside functions/index.js, which was generated during the Firebase initialization:

const functions = require('firebase-functions');
const next = require('next');

var dev = process.env.NODE_ENV !== 'production';
var app = next({ dev, conf: { distDir: 'next' } });
var handle = app.getRequestHandler();

exports.nextApp = functions.https.onRequest((req, res) => {
  console.log('Fetch UserAgent from Cloud Function:', req.headers['user-agent']);
  return app.prepare().then(() => handle(req, res));
});

Here, app.prepare() handles the server-side rendering, while handle(req, res) processes the request and sends the server-rendered page to the browser.

Next, update your firebase.json file to redirect all hosting requests to the Firebase function you just set up. Add the "rewrites" section to the "hosting" part of firebase.json:

{
  "hosting": {
    "public": "build",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
     ],
     "rewrites": [
       {
         "source": "**",
         "function": "nextApp"
       }
     ]
  },

Now it's time to build your Next.js app and deploy it to Firebase. First, navigate to your Next.js app directory and run:

npm run build

The build output will be in the .next folder. Copy the contents of that folder into the functions/next folder by running:

cp -r .next/* functions/next/

Finally, deploy your app using the Firebase CLI with:

firebase deploy

And there you go! Your Next.js app with server-side rendering is now live on Firebase.