推荐的文件结构[关闭]

Question

I'm looking for a start file structure for a website that holds a Angular front-end and an Php Slim Api.

My current setup is like

• index.html = Sngular start point
• api/
  • index.php = Slim start point
  • .htaccess = redirects http://domain/api/* to index.php
  • (remain folders and files of the php slim api)
• app/
  • app.modules.js, app.routes.js = main js angular
  • (remain folders and files of the angular website)
• vendor/
• node_modules/
• bower_modules/
• packages.json, composer.json, gulpfile.js = config files for tools

It works as I want: the index.html starts the angular website and all my api calls go under "http://domain/api/*" but it looks messy and I could not found a better structure for this project.

One solution is to store vendor, node_modules and bower_modules in a folder up the 'public_html' and leave just index.html, app and api in the 'public_html' but I can't do that in my host.

Answer 1

You can just skip backend and frontend folder and start with web (for php) and app(for angularjs). but I recommend to have these parent folders in case you need extra files like over all configs or scripts.

backend
 --web/          // Public visible backend folder
    -----index.php   // Entry point
    -----config/
    -----controllers/
    -----models/
frontend
--app/
    ----- shared/   // acts as reusable components or partials of our site
    ---------- sidebar/
    --------------- sidebarDirective.js
    --------------- sidebarView.html
    ---------- article/
    --------------- articleDirective.js
    --------------- articleView.html
    ----- components/   // each component is treated as a mini Angular app
    ---------- home/
    --------------- homeController.js
    --------------- homeService.js
    --------------- homeView.html
    ---------- blog/
    --------------- blogController.js
    --------------- blogService.js
    --------------- blogView.html
    ----- app.module.js
    ----- app.routes.js
    assets/
    ----- img/      // Images and icons for your app
    ----- css/      // All styles and style related files (SCSS or LESS files)
    ----- js/       // JavaScript files written for your app that are not for angular
    node_modules/
    bower_modules/Underscore, etc.
    index.html