Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/rdig/portfolio-snapshot

Personal portfolio public snapshot to allow code browsing. It is running live at http://glogovetan.com
https://github.com/rdig/portfolio-snapshot

Last synced: 18 days ago
JSON representation

Personal portfolio public snapshot to allow code browsing. It is running live at http://glogovetan.com

Awesome Lists containing this project

README 

        
Hi there! Thanks for stopping by!



## Heads up



This was build for public viewing and some of the confidential has been redacted, but besides that, it's an exact copy of my private repository.



## Quick Getting Started



This is are just the fastest steps to get you up and running with a development build of the app.



Clone the repo



	git [email protected]:rdig/portfolio-snapshot.git



Install `Npm`'s global and dev dependencies: (If you don't have `Node.js` installed check below)



	npm install

	npm install -d



Build the project



	npm run dev-once



## Requirements



The project requires `Node.js` and it's package manager `Npm`, plus it renders the pages using the `React.js` library / Ecosystem (Check below for more information). You can see the requirements by reading the `package.json` file.



On the server side, this project requires `Apache v2.4.x`, `PHP` newer than `v5.4` and an `Sqllite` database engine.



Since some of the directives are written for the new version of `Apache`, running it on pre-`2.4` will **break** the site.



## Node.js



This projects requires Node.js version 4 or newer.



*(Linux Debian-based distributions Install)*



To install node on your system, run the following commands: (use `setup_4.x` for version 4.x.x of node or `setup_5.x` for version 5.x.x)



	curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash -

	sudo apt-get install -y nodejs



Install the build tools (you may already have them):



	sudo apt-get install -y build-essential



Link the `nodejs` binary to the `node` or else you will run into problems along the way (because there is another node package - Amateur Packet Radio "Node" Program - that is going to screw with your setup):



	sudo ln -s /usr/bin/nodejs /usr/bin/node



## React.js



Before installing dev time dependencies (below) you will need `React` for this build to work.



This must be installed globally to prevent unwanted dependencies break (or packages getting installed multiple times).



To install, run `npm install -g react react-dom`. Only these this is used globally, the rest will be installed in `--save-dev` mode while initializing the project.



## Initializing the project



To get the project's required global dependencies (npm packages) run `npm install`



To get the project's required development dependencies (npm packages) run `npm install -d`



Depending on your internet connection, this could take a while.



## Building



To build the project (for development) just run `npm run dev`



This has `--watch` argument added to the run command so it will keep the process open and watch for file changes as you work.



This dev run contains `livereload`, but since this does not work as well as `hot-reload`, and is very likely to fail at some point, don't over-rely on it.



## Backend



The data storage / entry is handled in the backend by [Cockpit CMS](). This was chosen because of it's *lack* of front-end. It also has a pretty goo data retrieval interface via APIs.



For more documentation you look at the [official one](http://getcockpit.com/docs), or go strait to the [Github repo](https://github.com/aheinze/cockpit) of the project.



## Linting



The linting process was added to the dev build process and runs every time you build, you can also run it once, manually using `npm run lint`.



If you need to tweak the rules, the config file is non-standard and is named `eslint-rules.json`



## Testing



The unit tests are written in Jest using Jasmine v2 as a test runner.



You'll find them in the `test/` folder.



To test, just run `npm test`. Like the build command, this also has `--watch` argument added to the run command, so it will watch for changes / fails while you work.



## Documenting



Initially we were supposed to have a documentation generator (The likes of `yuiDoc` or `react-docgen`), but since I didn't find one suitable to work with, and that can be used with all libraries (eg: Vanilla JS and with React), the whole thing was postponed until I can find (or write) something better.



## Stylesheets (CSS)



The stylesheets are automatically preprocessed (if needed) by the appropriate `webpack` loader, so you don't have to worry about them. (Granted, it's a little slower than a stand-alone preprocessor, because this has to re-bundle the javascript files)



## Robots.txt & Sitemap.xml



Robots and Sitemaps are automatically generated by cockpit via [robots.php](./robots.php) and [sitemap.php](./sitemap.php).



If the articles are not published they will not show up.



### Static Sitemap



For static entries in the `sitemap` files, add / change data in the `Sitemap` `datastore` in Cockpit.



### Robots



Robots is only used for explicitly denying, not allowing.



For entries, add / change data in the `Robots` `datastore` in Cockpit.



*Warning* Apparently the name of the link gets parsed and matched, so try to avoid short non-descriptive links while using the `disallow` instruction. *Ex: blocking `cv` will also block `colocvial`*



## Dev server



Since this project uses `PHP` for the backend CMS, I did not want to use the built in `webpack` dev server (even though it has some nifty features), or use some weird two server config.



Because of that you have to supply your own web server that supports `PHP` >= `5.4`, `PDO` with `SQLite` support and has the `GD` extension `enabled`.



I'm currently using `Apache` on Linux. If you want to roll one up fast, I suggest checking out [Bitnami's LAMP Stack](https://bitnami.com/stack/lamp). `Bitnami` also has the equivalent stacks for [Windows](https://bitnami.com/stack/wamp) or [Mac  OS](https://bitnami.com/stack/mamp)



## Production



Before pushing the files to production, make sure you build them for production (minified, smaller, using production version of `React`) using `npm run build`



Except for a few, the files and folders require basic read permissions(`0644` / `0755`). Here are the exceptions the require group write (`0775`) permissions:



	/cp/storage/backups

	/cp/storage/cache/assets

	/cp/storage/cache/thumbs

	/cp/storage/cache/tmp

	/cp/storage/data

	/cp/storage/uploads



After loging in the `cockpit` dashboard for the first time, clear the cache so it will be re-generated for the new environment: `Settings -> Info -> Cache size` *(Click on value)*.