The Construct framework is a powerful Dart-based MVC framework designed for building robust and scalable web applications. It provides a structured architecture and a set of tools that streamline the development process.
- MVC architecture for organized code structure.
- Routing system for handling URL endpoints.
- View rendering with support for HTML templates.
- Flexible configuration and extensibility.
Before you start using the Construct framework, make sure you have Dart installed on your machine. You can install Dart by following the instructions here.
To install the Construct framework, add the following line to your pubspec.yaml file:
dependencies:
construct: ^1.0.0 # Replace with the latest versionRun dart pub get to install the package.
To create a new web application using the Construct framework, follow these steps:
- Create a new Dart project:
dart create my_app
cd my_app- Add the Construct framework to your
pubspec.yaml:
dependencies:
construct: ^1.0.0 # Replace with the latest version- Configure your application routes in
lib/app/config/routes.dart:
import'package:construct/core.dart';
import'../controllers/home.dart';
RouterconfigureRoutes() {
var router =Router();
router.add('/', (_) =>HomeController(HtmlView()).index(), HtmlView());
router.add('/json/:member',
(params) =>HomeController(JsonView()).jsonApiMember(params));
// Add more routes as neededreturn router;
}- Create your controllers in the lib/app/controllers folder. For example, here's how you can define a controller to handle requests:
import'package:construct/core.dart';
classHomeControllerextendsController {
HomeController(view) :super(view);
@overrideStringindex() {
return view.render('home/index.html'); // Render the index.html view
}
StringsayHello(Map<String, dynamic> params) {
return view.render('home/name.html',
params: params); // Render the index.html view
}
StringjsonApiMember(Map<String, dynamic> params) {
// notice empty filename, just params, since we want jsonreturn view.render('',
params: params); // Render the json view
}
// http://localhost:3000/json/Flak returns {"member":"Flak"} as content type html, // but http://localhost:3000/json/Flak.json will return json
}
6.Create your views in the lib/app/views folder. Place your HTML templates in this folder. For example, here's how you can define an HTML template in lib/app/views/home/index.html:
<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport" content="width=device-width, initial-scale=1.0"><title>Home</title></head><body><h1>Welcome to our website!</h1></body></html>6.1 Create name.html for /hello/Flak
<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport" content="width=device-width, initial-scale=1.0"><title>Home</title></head><body><h1>Hello, {{name}}!</h1></body></html>Build other controllers and templates in the respective folders under lib/app.
Run your application:
dart bin/construct.dart
or
dart took/watcher.dart when in dev mode to restart server when file changes.
Visit http://localhost:3000 in your browser to see your application in action.
For more details and documentation about the Construct framework, we are working on them, open issue if you want to contribute. If you encounter any issues or have questions, feel free to open an issue on our GitHub repository.
We welcome contributions! Enjoy building with Construct!