Unable to deploy angularjs app in apache webserver using virtual hosts - angularjs

Question

This is on Mac OS X El Captain
I am trying to deploy a web application built in Angularjs on Apache web server.
The folder is created in /Users/username/Sites/7MinutesWorkout
For the same in order to enable virtual host, i uncommented the below line from httpd.conf
Include /private/etc/apache2/extra/httpd-vhosts.conf
Also in httpd-vhosts.conf, included the below snippet
<VirtualHost *:80>
DocumentRoot "/Users/<username>/Sites/7MinutesWorkout"
ServerName 7MinutesWorkout.com
ServerAlias www.7MinutesWorkout.com
ServerAdmin <username>#dummy.com
ErrorLog "/private/var/log/apache2/7MinutesWorkout.com_error_log"
CustomLog "/private/var/log/apache2/7MinutesWorkout.com_access_log" common
<Directory>
Options Indexes FollowSymLinks
AllowOverride All
Order allow,deny
Allow from all
</Directory>
Also made entry in /etc/hosts as
127.0.0.1 7MinutesWorkout.com
127.0.0.1 www.7MinutesWorkout.com
Restarted apache by the command sudo apachectl restart
But when i try to access the site, i get the error page, this site cannot be reached.
On executing the command
apachectl configtest
gives the output as AH00526: Syntax error on line 47 of /private/etc/apache2/extra/httpd-vhosts.conf:
Directory directive requires additional arguments
There is only one entry as of now in the httpd-vhosts.conf as specified above.
Please suggest

Answer 1

I think your issue is with the Require all granted which needs to be present.
Here is the relevant part of my config, which works
<Directory>
Options Indexes FollowSymLinks
# AllowOverride controls what directives may be placed in .htaccess files.
# It can be "All", "None", or any combination of the keywords:
# AllowOverride FileInfo AuthConfig Limit
#
AllowOverride All
#
# Controls who can get stuff from this server.
#
Require all granted
# onlineoffline tag - don't remove
Order Allow,Deny
Allow from all
# Allow from 127.0.0.1
# Allow from ::1
# Allow from localhost
</Directory>