Making its debut in 2016 as an open-source project on GitHub, Next.js has quickly become a known solution for front-end development. Today, many huge brands including Nike, OpenAI, Netflix and Spotify are all using Next.js as their JavaScript framework.

With so many options available, what makes Next.js stand out in front of the crowd, and how do we at Voyage use it to create high-performing, efficient and scalable React apps?

Next.js is a React-based JavaScript framework for building server-rendered or statically exported websites and applications. Because of its focus on React, it inherits all of the benefits that come with using React, such as a strong community support and a vast ecosystem of plugins and libraries, however, it moves beyond traditional React apps that can only render their content in the client-side browser, which leads us to the number one unique benefit of the solution.

Arguably the main benefit of Next.js is that it allows users to choose between two different modes of operation: server-side rendering (SSR) or static site generation (SSG).

With SSR, the page is rendered on the server and sent to the client as HTML. This process happens on each request, which means that if you have an e-commerce site, each user will see slightly different content depending on their interaction with the site, such as the items in their shopping cart.

This approach has a few advantages. First, because the content is rendered on the server, search engine crawlers can index content more easily, which can lead to better SEO. Second, SSR generally results in better performance because the HTML is already formed when the browser receives it - there's no need for additional JS to be downloaded and executed before the content is displayed. And third, because the content is rendered on the server, you can use backend data sources, such as databases, to pre-populate your frontend UI - something that's not possible with traditional single page applications (SPAs).

Static site generation for low-cost projects

The beauty of Next.js is that for websites that don’t rely heavily on dynamic data, SSG is still an option and can help to keep costs low.

With SSG, a website is generated at build time and all of the resulting files are deployed to a CDN (content delivery network). Because the content is generated ahead of time, there's no need for a backend server, making SSG an attractive option for sites that are low-cost or hosted on highly-scalable platforms such as lambda functions or Netlify Functions.

With this option you can also generate static versions of pages that would otherwise require server-side rendering, like an e-commerce product detail page, which can minimise overall build times and improve performance by reducing the amount of work that needs to be done at runtime.

One of the standout pros of Next.js is the potential to improve performance, thanks to built-in optimisations such as automatic code splitting and efficient asset loading. This not only accelerates load times but can also create a more responsive user experience. In addition, the framework's straightforward setup and intuitive file structure simplifies the development process, allowing developers to quickly initiate new projects and easily manage their code.

With its focus on fast loading speeds and search engine optimisation, Next.js can help increase conversion rates and drive sales. It also comes equipped with a variety of tools that to enhance marketing efforts, such as integration capabilities for social media and email campaigns. The extensive documentation available can further supports developers, making it easier to learn and implement the framework effectively.

Despite its advantages, Next.js does come with potential challenges. While the framework is designed for simplicity, it still requires a solid understanding of React, JavaScript, and web development principles, which can pose a learning curve for those new to these technologies. Additionally, Next.js relies on various external packages, like React and Webpack, which can introduce potential compatibility and security issues.

The performance optimisations offered by Next.js can at times lead to unnecessary overheads, particularly for smaller projects where such enhancements aren’t necessary. If opting for a serverless deployment, businesses need to also consider additional infrastructure requirements and associated costs. Finally, Next.js adheres to specific conventions and best practices, which can limit customisation options for certain projects, potentially restricting flexibility in development.

Choosing the right technology for your project can seem daunting, with several options available and each with their own set of benefits and potential challenges. At Voyage we’re passionate about understanding the tech, how it performs for different projects, and how we can get the most out of it.

While some clients come to us knowing what solutions they want to use, our discovery process is an important phase where we can drill down into what your overall aim is, and how we can maximise your tech investment to achieve the best results.

 for more about how we can bring your Next.js project to life.

Choosing Next.js for your next web frontend

Why Next.js could be a good choice for your next web frontend

If current advancements in artificial intelligence (AI) are anything to go by, this year AI will fundamentally transform how websites, web applications and mobile apps are developed, deployed and maintained.

To hit the ground running, here’s a guide on what to consider when choosing your AI agency or digital studio for your next project.

The traditional model of working with a digital agency is being fundamentally changed thanks to AI. Previously, building a website or app, or delivering a new feature, might require a team of three engineers, a designer, a quality assurance specialist and a project manager, all working over several weeks. AI compresses both team size and delivery timelines. Various services and solutions can handle repetitive coding tasks, optimise performance and assist with quality assurance.

: AI speeds up processes, allowing teams to deliver faster.

: More efficient workflows and automation reduce the need for large teams.

: AI-enabled systems help streamline testing and enable rapid iteration.

Increased project scope within the same budget

: Thanks to AI automation, more complex features can be added without additional costs.

But this isn't simply about cost reduction, it's about value redistribution.

With AI accelerating the foundational aspects of software development we can now invest more resources in what truly matters: crafting exceptional user experiences and honing in on strategic business outcomes. Instead of the common take that AI will do away with our human experts, we're finding it’s allowing us to enhance our creativity and bring greater value to clients.

One critical decision business leaders face is whether to build AI capabilities in-house or partner with an AI agency. While some organisations may opt to explore internal AI implementation, partnering with a digital agency that has already integrated AI into their workflows offers several advantages:

Immediate access to optimised AI development processes

: You can hit the ground running without the need to build out AI infrastructure.

No learning curve or implementation delays

: Avoid the time-consuming process of learning AI tools and methodologies from scratch.

: Established agencies have refined their processes over time, reducing the risk of costly errors.

Scalable expertise without internal hiring

: Instead of hiring and training an internal team, you gain access to top-tier talent with the right expertise.

Working with an agency means you can focus on your core business while leaving the AI-powered development to experts who already have the tools and knowledge to execute it efficiently.

At first glance, AI’s efficiency gains might suggest a focus on speed over quality. However, in the hands of the right agency this won't be the case. With AI handling many of the routine and repetitive tasks in web and app development, there can be more time and energy to devote to the finer details of the project.

While this differs for each project, it can include:

: With less time spent on manual tasks, designers can focus on creating visually stunning, high-quality experiences.

: AI allows for faster performance analysis and optimisation, ensuring the app or website runs smoothly and quickly.

: AI tools can help identify accessibility issues and automatically suggest improvements, making your digital products more inclusive.

: With AI-powered insights into user behaviour, agencies can refine the UX for maximum impact.

: AI can also continuously scan for security vulnerabilities, ensuring that your digital product is always secure.

In essence, AI doesn’t just accelerate development, it also elevates it by allowing more focus on the craft of the product.

Making projects smarter: The rise of AI Agents

AI’s influence extends beyond the development process itself. AI agents are now an integral part of the entire project lifecycle, changing how digital transformation projects are planned, executed and maintained.

The discovery phase, once reliant on long meetings and documentation, can now be enhanced with AI agents. During this phase these tools can:

Analyse existing digital assets and competitor landscapes

: AI can assess your current website or app, along with your competitors, to provide valuable insights.

Generate comprehensive technical specifications

: Instead of waiting for a human team to draft documents, AI can automatically generate technical specifications based on requirements.

: AI can detect potential bottlenecks before development even begins, allowing for better preparation.

: With AI’s ability to analyse past projects and workflows, it can suggest more accurate timelines and resource allocations.

Once development begins, AI agents can act as collaborators, helping to:

: AI tools can automate code generation and even optimise existing code for better performance.

Conduct real-time code reviews and quality assurance

: AI-powered tools can review code for errors, improving the quality and reducing human oversight.

: Continuous testing and automated bug tracking help ensure a smooth development process.

: AI can automate the creation and updating of documentation, ensuring it's always current and accurate.

One of the often forgotten but very exciting potential implementations of AI comes post-launch, as these systems enable continuous optimisation and maintenance:

Continuous performance monitoring and optimisation

: AI can monitor performance in real-time and suggest improvements based on data.

Automated security vulnerability detection

: AI can automatically identify and patch security vulnerabilities, ensuring your site or app remains safe.

: AI can track user behaviour, offering insights into how to improve features or content based on actual usage.

: AI can dynamically adjust content based on user preferences, providing a more personalised experience.

AI is redefining what it means to partner with a web and app development company or digital agency. Rather than simply outsourcing development hours, you’re investing in a hybrid team - one that combines human expertise with AI capabilities.

When done right, this partnership can offer several key benefits:

: AI-driven processes ensure a smoother workflow and fewer surprises.

: With AI tools speeding up development and testing, you can launch products quicker.

: AI helps maintain consistency and quality, reducing the likelihood of bugs and errors.

: With repetitive tasks automated, there’s more room for creative and innovative solutions.

As we move further into 2025, without a doubt AI's role in software development and digital transformation will continue to develop.

 will see AI systems capable of co-managing entire development workflows, including self-optimising websites that evolve based on user interactions and automated content generation for faster, more flexible updates.

 will enable AI-powered user experience customisation, delivering tailored experiences in real-time, along with predictive user journey optimisation to ensure an easy path for each visitor.

, allowing seamless connectivity with enterprise systems to enable real-time data syncing and more powerful, data-driven reporting.

Choosing the right AI agency or digital studio for your project is a critical decision.

Here are some essential questions to ask:

Does the agency have proven AI integration in their workflow?

 Look for agencies that have successfully implemented AI in their previous projects.

Can they demonstrate tangible efficiency gains?

 Ask for examples of how AI has reduced development time and costs in past projects.

Do they strike the right balance between automation and human expertise?

 Ensure they don’t rely solely on AI but combine it with skilled professionals.

 Make sure they have strong processes in place for ensuring the quality and security of your product.

The future of web and app development is increasingly driven by AI. It’s not just about faster development, it's about reimagining what's possible in creating digital experiences on the web and apps. The most successful companies in 2025 will be those that understand AI not as a replacement for human talent, but as an amplifier of it.

The AI revolution in website development for New Zealand leaders

The AI revolution in website development: What New Zealand leaders need to know

As competition in the digital world heats up and AI solutions empower seeming quick wins, it’s important to ask the right questions up front. If not, what may seem like a huge saving could only end up costing more in the long run.

When a digital agency or studio promises to deliver a fully functional, lead-generating website in a matter of weeks using AI tools, it's natural to feel excited. And it’s true that the emergence of AI tools including drag-and-drop builders, AI-generated content and template-based design systems, can, technically speaking, condense months of strategic work into much shorter time frames. And yet, in our view, this excitement should be tempered with careful consideration.

Just as you would question a fitness trainer promising to get you your dream body in a month, you should approach ultra-quick website promises with healthy skepticism. The foundation of your digital presence deserves the same level of scrutiny as the foundation of physical health. While AI innovations have their place, as the old adage goes, if something sounds too good to be true it probably is.

Here are 10 questions to help uncover hidden costs that might be lurking beneath the surface of big promises and attractive offers.

Top 10 questions to ask before committing to an accelerated website redesign

1. What level of strategic thinking can I expect in the timeline?

In the traditional website development process the discovery phase can take weeks. Agency teams conduct user research, analyse competitors, map customer journeys and develop content strategies. While AI can reduce the manual labour of these tasks, there's only so much you can reduce without cutting corners.

More specific questions or talking points could include:

How will you understand my business, customers and industry well enough in the reduced timeline?

What specific strategic deliverables will I receive?

How much of the strategy will be AI-generated versus human-crafted?

Will we conduct genuine user research, or use AI to consider industry trends?

How will you incorporate my business goals into the strategy?

 A website built without proper discovery sessions may look good but fail to perform. You might end up with a site that doesn't convert visitors, doesn't align with your sales process, or doesn't effectively communicate your unique value proposition.

2. How customised will my website truly be?

AI excels at creating variations on established patterns. What it cannot easily do is understand the nuances that make your business unique, and translate those into completely custom designs and experiences.

Are you using templates that are customised, or building custom designs?

How many unique page templates will be designed specifically for my business?

Can you show me examples of AI-assisted designs you've created that don't look like templates?

What parts of the design process will involve human designers, and what parts will be AI-generated?

How will you ensure my brand identity is properly reflected in the design?

 Template-based websites often struggle to differentiate businesses from their competitors. You might save time upfront but lose opportunities to stand out in your market.

3. Who will create the content, and how will it reflect my brand voice?

AI content generation tools such as ChatGPT can produce serviceable copy quickly and may be useful for the likes of SEO. However, this content lacks the nuanced understanding of your brand voice, industry-specific knowledge and emotional intelligence needed to be compelling.

When it comes to site content, you can ask:

How much of my website content will be AI-generated?

What processes are in place to ensure AI-generated content accurately reflects our brand voice?

Will human writers review and refine AI-generated content?

How will you incorporate my company's unique expertise and perspectives?

What happens if the AI-generated content misses the mark?

 Generic, AI-generated content can undermine your brand's credibility and fail to connect with your audience. The cost of rewriting low-quality content after launch typically exceeds the cost of doing it right the first time.

4. How maintainable will the website be for my team?

AI-accelerated builds sometimes sacrifice backend usability for frontend speed. The best websites are fully functional for both visitors to the site and the management team behind the scenes.

To ensure the site is easy to maintain, you may ask:

What CMS will power the website, and how user-friendly is it?

Will my marketing team be able to make updates without developer assistance?

How extensively can we customise page layouts after launch?

What training will you provide to ensure my team can maintain the site?

Are there any proprietary systems or AI tools that will require ongoing subscriptions?

 If your team can't easily update the website, you may end up with an ongoing agency retainer you didn’t expect or stuck with outdated content.

5. How will the website handle complex functionality and integrations?

AI tools excel at creating standard website elements but struggle with complex functionality and integrations. This includes flourishes and elements that delight users and leave a lasting impression.

Ensure added nuance and functionality by asking:

How will you handle integration with our CRM, marketing automation and other business systems?

What custom functionality can be included in the accelerated timeline?

How thoroughly will integrations be tested?

What's the process if custom functionality requires more development time?

How will AI tools be used to accelerate these technical aspects?

 Poorly implemented integrations can break, leading to lost data, frustrated users and emergency developer fees to fix issues.

6. What happens when the timeline inevitably extends?

Even with AI assistance, website projects frequently extend beyond initial timelines due to feedback cycles, content delays or technical challenges.

To address unexpected changes, be sure to ask upfront:

What happens if we need more revisions than the package includes?

Are there additional costs if the project extends beyond the set timeline?

How do you handle scope changes during the project?

Will the same team remain dedicated to my project if it extends?

What's your track record for on-time delivery with AI-accelerated projects?

 Budget overruns can quickly erode the perceived savings of an accelerated build.

7. How will you optimise for performance and SEO?

AI can help generate meta descriptions and alt text, but comprehensive SEO and performance optimisation are best with human expertise.

What specific SEO deliverables are included?

How will you incorporate our keyword strategy?

What performance metrics do you guarantee the website will meet?

How will you optimise images and other media?

What post-launch SEO support is included?

 Poor SEO and performance can severely limit your website's effectiveness, regardless of how quickly it was built or how good it looks.

8. What post-launch monitoring and optimisation is included?

Websites should continually evolve based on user data and business needs. This means the best websites include post-launch monitoring and ongoing optimisation.

To ensure you’ll have support post-launch ask the following:

Will you implement analytics and heat mapping tools?

Do you follow a growth-driven design approach with continuous improvements?

How long after launch will you monitor and refine the website?

What ongoing optimisations are included in the package?

 Without post-launch optimisation, you might be stuck with initial performance metrics that could have been significantly improved with data-driven refinements.

9. How secure and compliant will the website be?

AI-accelerated builds can prioritise speed over security and compliance. With digital security threats becoming more advanced, this is a growing priority for websites big and small.

Be sure to ask specific questions such as:

What security measures will be implemented?

How will you ensure compliance with GDPR, CCPA, ADA, or other relevant regulations?

Will you conduct security testing before launch?

How are you addressing AI-specific security concerns?

What is your process for keeping the website secure after launch?

 Security breaches and compliance issues can lead to substantial financial and reputational damage.

10. How much of my input and time will be required during the process?

Even AI-accelerated projects require significant client involvement if they are to wow visitors and serve the overall business objectives. From the start, this should be factored into the overall cost.

To make sure you know your commitment, try asking:

What are the expected time commitments from my team?

What decisions will we need to make, and when?

How much content will we need to provide?

How will feedback be incorporated with such tight timelines?

 If you're not prepared to provide timely feedback and content, the project will inevitably be delayed, or worse, proceed without proper guidance.

Making the right decision for your business

There's no one-size-fits-all answer to whether an AI-accelerated website redesign is right for your business. The decision depends on your specific needs, budget, timeline and goals.

Here are some scenarios where an AI-accelerated approach might make sense:

You need a simple informational website with minimal custom functionality

10 questions to ask before you build a website

10 questions to ask before you build a website: Uncovering hidden costs in an age of ‘quick wins’

Imagine a world where we all ‘loved better’. If we were to inspire such change, the best place to start is when we’re young. This is the crux of the Ministry of Development’s (MSDs) Love Better campaign, focusing on encouraging New Zealand’s youth to have healthier and happier relationships for a stronger society overall.

We were proud to be brought onboard for a full website build, marking an important phase of the campaign and offering a central repository of information and inspiration of Love Better’s central themes. This project also got us thinking about how the best websites utilise every tool in the toolbox to speak directly to the target audience, and can have a positive influence far beyond the digital sphere.

The Love Better platform is an excellent example of how a website can have an impact on society at large. The ultimate goal of MSDs campaign is to support our young people to navigate the rocky waters of relationships. Our first attempts at love, which we all so often stumble through, have a big impact on the trajectory of how we think and feel about ourselves and our partnerships.

Understanding this, with the Love Better campaign MSD hopes to accentuate support, encouragement, inner empowerment and a sense of belonging for our young people. Already, the MSD team has received ample feedback that shows how speaking directly to the next generation can make them feel inspired and connected. It follows that healthier youthful relationships leads to happier families and a stronger population as a whole.

So how did we achieve this? At the heart of the Love Better website is its relatability. During the discovery phase of the project we were able to leverage extensive research to understand the needs and concerns of New Zealand’s youth - the demographic the website had to directly speak to.

We knew one core component was the content - we had to share real-life stories, relatable scenarios and practical advice - but we also had to go beyond that. We wanted to use the medium of the website itself to invite visitors in, make them feel safe and understood, and that they were a part of the story.

With our design compatriots over at Not Another, we made this a reality. The final website plays with colour, graphics, animation, imagery and more to not only deliver information but create an experience that is playful, bold, interactive and memorable. Quizzes and videos engage visitors and encourage self-reflection, while the ability to personalise the site with colours and context offer a much needed sense of empowerment.

The ripple effect of impactful impressions

The way we share and relay information through a website can have an undeniable ripple effect. While this is particularly palpable for the Love Better site, it’s true for our other work too.

If someone is looking to buy their first home and they go to the Mike Greer Homes website, what they see and save will inform conversations with their realtor, and can greatly influence their final home purchase. For someone interested in a career with New Zealand’s Defence Force (NZDF), it’s highly likely their first port of call will be to check out the dedicated website. From here, the roles they find, the information about each one and the broader stories about life with NZDF can send them on a trajectory that will shape and inform their life.

When it comes to Love Better, this website serves as a light-hearted experience that delivers a deeper message and a broader impact. To inspire conversations around what makes an uplifting relationship and what constitutes an unhealthy one, to provoke visitors to input their own interests, questions and feelings, is a way of broaching the lifelong process of self-empowerment - something that’s crucial when navigating our forays into love and relationships.

This can inspire visitors to think of themselves and their relationships more broadly, instigate conversations that are more real or vulnerable, and encourage people to foster connections that genuinely work for them. It’s not too grand to say when these seeds are sown this leads to stronger communities as a whole.

Our Love Better project is exciting not only because it’s a very cool website (in all ways, from how it functions in the backend to the funky visuals all visitors encounter) it reminds us of the place and impact of websites as a whole. It excites us that our interactions in the digital sphere can lead to inspiration and connection offline, and help to guide us in our lives over time.

We hope the Love Better website will continue to have a positive ripple effect for all of New Zealand’s youth as they chart the sometimes unpredictable waters of love.

Latest updates, thinking and insights from the team at Voyage

Christchurch