Where to put static files such as CSS in a spring-boot project?
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
In a Spring Boot project, correctly placing static files such as CSS, JavaScript, and images is critical for efficient web application development. This not only organizes the project structure but also ensures that the application serves static resources properly. Here’s how you can set it up effectively.
Static Files in Spring Boot Projects
Spring Boot aims to simplify the process of building stand-alone, production-grade Spring-based applications. One of the critical aspects of any web application is serving static content. Spring Boot provides a standard location for static resources, making it easy to manage and serve these files.
Default Locations
Spring Boot serves static content from specific directories in the classpath. By default, it looks for resources in the following directories:
/static/public/resources/META-INF/resources
These directories should be placed under the src/main/resources directory. When your application is packaged, these resources are packed into the JAR file and can be accessible via the web.
Example Structure:
Serving Static Files
Spring Boot's ResourceHandlerRegistry automatically maps these paths to the root path of your web context. For instance, a file located at src/main/resources/static/css/style.css will be available at http://<server-host>:<port>/css/style.css.
Customizing Static Locations
You may override the default locations and define your own by using the addResourceHandlers method in a @Configuration class. Implement the WebMvcConfigurer interface for fine-grained control.
Example:
In this setup, you can put your static files under src/main/resources/custom-static/.
CSS, JS, and Image Files Organization
Depending on the size and complexity of your project, organizing static files into different folders such as css, js, and images is a standard practice. This not only helps with direct access but also enhances load time through browser caching and better file management.
Example Files:
Caching Static Files
Spring Boot can cache static content to improve the performance of your web application. You can define cache policies by setting the Cache-Control HTTP header.
Example:
This example configures the application to cache CSS files for 3600 seconds (1 hour).
Serving Static Files in Production
In production environments, it's advisable to serve static content directly via a content delivery network (CDN) or a dedicated static file server, such as Nginx or Apache, to reduce load and improve page load times. However, Spring Boot’s setup is more than adequate for development and small-to-medium-sized projects.
Summary Table
| Aspect | Default Behavior | Customization |
| Default Directories | /static, /public, /resources,
/META-INF/resources | Use addResourceHandlers
to define custom paths |
| Access URL | http://<host>:<port>/<folder> | Same, can be customized via handler |
| Organizing Files | Use separate folders for CSS, JS,
Images under /static | Follow the same practice for clarity |
| Caching | Not enabled by default | Set via setCachePeriod on handler |
| Production | Served from the same app server | Use a CDN or a dedicated file server |
This structure and configuration ensure that your static files are efficiently organized and accessible, forming a solid foundation for your Spring Boot application. By understanding these various aspects, you can create a robust setup, enabling both development efficiency and production performance.

