This is the frontend application of the MiST4.0 database, a comprehensive platform for the analysis and exploration of bacterial and archaeal signal transduction systems.
Built with modern technologies, the application delivers a modern, intuitive, and responsive user experience for biomedical researchers and bioinformaticians.
The web application is available at mistdb.com
-
RESTful API Integration: Seamlessly connects to the MiST4.0 API, offering programmatic access to microbial genome and gene data. JSON responses support high-throughput analysis.
-
Smart Search System: Allows querying microbial genomes and genes by various identifiers including organism names, taxonomy levels, RefSeq accessions, locus tags, and more—no need to specify identifier types.
-
Advanced Filtering: Users can refine search results by taxonomy or genome assembly level via built-in filters or dropdown menus.
-
Detailed Genome and Gene Views:
- Genome detail pages show comprehensive information about the selected genome, Bioproject metadata, and signal transduction profiles as interactive graphs and tables.
- Gene detail pages present domain architectures, feature annotations, and graphical gene neighborhoods.
- The chemosensory systems table shows all the chemosensory pathways encoded in the given genome.
-
Scope Search: Search genes and proteins within a specific genome context by setting a “scope” from search or genome detail pages.
-
Cart System: Add genomes or genes to a cart for batch analysis or sequence download.
-
Dual Database Navigation: Easily switch between Genomes and Metagenomes views using an integrated interface switcher, with distinct color themes and seamless backend routing.
-
Enhanced Visuals: Protein domain diagrams are scaled proportionally with length indicators for visual comparison.
Angular • Angular Material • TypeScript • JavaScript • NgRx • RxJS
D3.js and custom packages for data visualization
SCSS • PUG • HTML • Font Awesome
Explore the frontend powering a cutting-edge microbial informatics platform—designed for performance, clarity, and scientific insight.
Run npm start or yarn start for a dev server. Navigate to http://localhost:4300/. The app will automatically reload if you change any of the source files.
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
Run ./node_modules/.bin/webpack to build the project. The build artifacts will be stored in the dist/ directory. Use the -p flag for a production build.