# 开发记录 ## Info |Item|Stack| |--|--| | FRAMEWORK | Symphony 3 | | HOST | AWS → Linode(Amazon Linux AMI → Debian) | | WEB SERVER | Apache → Nginx (HTTPS:certbot auto renewl) | | DEV ENV | ~~CodeAnywhere~~ VSCODE SFTP | | MD EDITOR | http://lab.lepture.com/editor/editor.js | | MD HIGHLIGHT | highlight.js https://www.bootcdn.cn/highlight.js/ | | MD PARSER | https://marked.js.org/ | | MD Other Utils | MathJax | ### Database Auto Backup (crontab / gdrive) crontab定时dump然后传到Google Drive的简单backup。 ```cron MAILTO='email' 30 6 * * sat sh ~/backup_db.sh ``` ```sh LOGFILE="/var/log/backup/backup.log" GDRIVE_ID=gdrive_id dbnm=database_name dt=$(date +'%Y%m%d') mysqldump -uroot -pdummy $dbnm > "${dbnm}_${dt}.sql" gdrive upload "${dbnm}_${dt}.sql" -p $GDRIVE_ID echo "[${dt}]${dbnm}_${dt}.sql Uploaded to gdrive/db_back" >> $LOGFILE rm "${dbnm}_${dt}.sql" ``` ### Markdown式样 - comments: begin with '^', style: color:#4c4c4c - font-family: STKaiti / STSong / STFangsong - hr tag: border-bottom:1px solid #4c4c4c > 踩坑MEMO:直接把markdown原文放到div里再用jQuery`html()`来提取文本会造成特殊字符的转义....所以改为放到textarea里再用`val()`来取原文,另外twig默认会有一次转义,加上`|raw`的filter可以取消转义。 ### Layout - `#wrapper` Inner - `#sidebar` ```css #sidebar + #wrapper:hover{ margin-left: 18.5rem; } ``` ### SEO - template: `*.html.twig` ```text {% block title %}whatcode{% endblock %} {% block metaTag %} {% endblock %} ``` - views: `article.html` ```text {% extends 'partArticle.html.twig' %} {% block title %}{{ article.title }}{% endblock %} {% block metaTag %} {% endblock %} ``` 另外symphony有一个看上去挺复杂的[SeoBundle](https://symfony.com/doc/current/cmf/bundles/seo/introduction.html) ## 怎样都好的开发记录 ### 2016-8-3 初步开发 phpmyadmin限制ip访问设置。 $ sudo sed -i -e 's/127.0.0.1/your_ip_address/g' /../phpMyAdmin.conf $ sudo service httpd restart symphony秘密配置在parameter.yml,公开的repository得记住加gitignore。 **mysql密码重置**: ```bash sudo service mysqld stop sudo mysqld_safe --skip-grant-table& //mysql交互 mysql use mysql update user set Password =password(''密码) where User='root' exit ``` > mac上装完mysql回来mark一下, 5.7版本的password字段已经改成authentication_string了,可以用desc tables查看。 ------------------------------------------- **Git 分支管理和冲突解决** [link][Git 分支管理和冲突解决](http://www.cnblogs.com/mengdd/p/3585038.html) cherry-pick: 拣选另一条分支上的某个提交条目的改动带到当前分支上。。 要拣选多个提交,可以给git cherry-pick命令传递-n选项,比如: git cherry-pick –n 321d76f 05-Aug-2016 修改了favicon,首页:嫌疑犯X的献身 30-Aug-16 想要增加tag的功能,e.g:https://joshuajohnson.co.uk/Choices/ ### 2016-9-06 完成了搜索功能,加入文章置顶功能 - 注意mysql字段不要用驼峰法,要用下划线连接。 - bug,article title的长度设成了varchar(32),只有8个字长,修改为varchar(64)。 - date/datetime 类型,defaul值最好都从1970-01-01开始,高版本的mysql很容易报错。 ### 2016-9-08 bug修正,文章出MK语法外,可以直接编辑html标签 文章正文没注意到加了 | e('html')这样的filter。 于是所有tag都被转义。 以为是marked.js的问题,在github issue里各种看html escape。 ### 2016-9-16 文章内容width=50em,增加了下一篇和上一篇功能 觉得doctrine好难用,文档也不是很详细,可能这ORM适合更复杂的应用吧...对blog来说好鸡肋。createQuery() Select between不能用,limit不能用,要调用setMaxResult get到了css triangle的画法,重点就在于元素高宽为0,但是有border。 ```css .arrow-left{ width:0;height:0; Border-right:5px solid #888;} ``` ### 2016-9-24 开发了简历功能 直接写了一个profile页面,后台可以直接编辑写入。然后加了config字段判断是否开启。简单粗暴。 ### 2016-11-01 适配了13.3寸mobile 用mac看的时候,被layout吓了一跳,设置的max-width是1280px,14寸以下排版都乱了。所以从新调整,顺便把mobile的菜单适配也做了。 最后加了简历编辑功能。新增了define.php保存一些常量。 ### 2016-11-16 图片上传功能,七牛云 下载了php的sdk [七牛云帮助文档](http://developer.qiniu.com/article/index.html),本地调试穿透内网是用的natapp,开通了一个免费的通道,下载配置config.ini(其实就是配authtoken),然后修改server配置 listen 80 把公网ip指向本地的项目地址。 - [Symfony 2 + Twig global variables](http://stackoverflow.com/questions/9263903/symfony-2-twig-global-variables) - [七牛上传的响应处理大全](http://blog.csdn.net/guoer9973/article/details/45916709) 七牛云提供了图片缩略图功能 [图片高级处理 (imageMogr2)](http://developer.qiniu.com/code/v6/api/kodo-api/image/imagemogr2.html) ```php //指定新高度为 467px: "eg.http://78re52.com1.z0.glb.clouddn.com/resource/gogopher.jpg?imageMogr2/thumbnail/x467" ``` 然后服务器这边处理的时候也对width大于1024的图片进行了压缩处理,重点是 imagecreatetruecolor+imagecopyresampled: ```php $image_p = imagecreatetruecolor($new_width, $new_height); // preserve transparency if($type == "gif" or $type == "png"){ imagecolortransparent($image_p, imagecolorallocatealpha($new, 0, 0, 0, 127)); imagealphablending($image_p, false); imagesavealpha($image_p, true); } $image = imagecreatefromjpeg($filename); imagecopyresampled($image_p, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height); ``` 流程基本参考了之前做项目水印的流程:[PHP 图片上传 水印添加](http://whatcode.cc/blog/type/1/id/47) 利用imagecopyresized() 进行resize同时合并原图与水印。 ### 2016-11-24 xdebug 感觉本地访问也很慢,所以希望用xdebug分析一下性能,[文这里](http://whatcode.cc/blog/type/1/id/66)。 除了db connection很花时间,还有就是依赖注入容器(appProdDebugProjectContainer)下的get swiftmail er的服务,然后我并没有用到这个,有时间研究一下symphony怎么去掉这个服务。 ### 2016-12-12 HTTPS 看到消息,似乎今年后chrome就要对http加unsecurity小红旗了,所以寻思给自己的blog也装上SSL加密证书。 首先确认httpd.conf:`httpd -V` apache设置: #### mod_ssl.so 本地module里并没有这个模块,wget进行安装 ```bash wget http://www.modssl.org/source/filname tar -zxvf mod_ssl.tar.gz ``` ### 2016-12-29 重新调整排版 + escape + twig include + 回收站 参考了[Qdaily](http://www.qdaily.com/articles/23919.html)的文章详细,和[paiza開発日誌](http://paiza.hatenablog.com/)的代码区域。 如果是英文排版比较喜欢sitepoint,ROBOTO字体做正文很漂亮。 ### [bug] escape: angle brackets 解决了marked.js 解析非html代码会将“<”等转义的bug,twig输出如果加上| escape就可以完美解决,但是因为想要在Markdown编辑html标签所以必须以raw方式输出,< code >区域要单独处理: [reffered issue](https://github.com/chjj/marked/issues/160) #### twig include 终于找到这个方法了,把所有页面的公共部分都取出来放在了common下。 ```html {{ include('common/articleList.html.twig', { 'articleList': articles }) }} ``` 发现一个大bug,原来分页一直不对的,因为是用ajax请求,没有加上文章列表的类型。 #### sql error [Expression #1 of ORDER BY clause is not in SELECT list, references column 'elgg.ps.value' which is not in SELECT list](https://github.com/Elgg/Elgg/issues/8121) Solution→[cnblogs](http://www.cnblogs.com/lonelywolfmoutain/p/5433581.html) ### 2017-01-01 七牛云,空间资源删除功能 修改了一些后台上载空间的功能和式样,不知道为何回调函数没成功,特地去买了穿透内网的付费隧道,打算之后再看看。文章编辑页面添加了onbeforeunload确认页面离开。 浏览了fontawsome提供的examples,提供了fa-fw的calss,终于实现列图标对齐了,治愈强迫症。 ### 2018-08-26 Apache → Nginx 自从Linode被自己折腾坏过后就再也没更新过orz 昨天花了一晚上重新搭建了环境,白给linode交了半年多的钱。 顺便服务器从apache换到了Nginx,然后看到symphony4都出来了。 ### 2020-11-28 markdown editor (lepture) 终于把原生Textarea换成markdwon编辑器了。 [选型参考: Top 7: Best Markdown editors Javascript and jQuery plugins](https://ourcodeworld.com/articles/read/359/top-7-best-markdown-editors-javascript-and-jquery-plugins) - 采用了看上去比较简洁的lepture的编辑器:https://github.com/lepture/editor 最近完全放弃本地开发,全部用codeanywhere了。 ```bash cd ./web/assets/ mkdir -r lepture-editor/fonts cd lepture-editor # download font wget https://lab.lepture.com/editor/fonts/icomoon.woff -P fonts # download js, css wget http://lab.lepture.com/editor/marked.js wget http://lab.lepture.com/editor/editor.js ``` 发现自己以前的页面好混乱。 - 编辑页面:`articlePost.html / part.html.twig` - 详细页面:`article.html / partArticle.html.twig` - 新增页面: `newArticle.html / part.html.twig` ### 2020-11-29 TOC - 技术选型:[i5ting_ztree_toc](https://github.com/i5ting/i5ting_ztree_toc) ```bash cd /web/assets/i5ting_ztree_toc wget https://raw.githubusercontent.com/i5ting/i5ting_ztree_toc/master/dist/ztree_toc.min.js wget ../i5ting_ztree_toc/master/js/jquery.ztree.core-3.5.min.js wget ../i5ting_ztree_toc/master/js/jquery-1.4.4.min.js wget ../i5ting_ztree_toc/master/css/zTreeStyle/zTreeStyle.css ``` - `article.html` ```js $('#tree').ztree_toc({ is_auto_number: false, documment_selector: '#md-content', highlight_on_scroll: false, is_highlight_selected_line: false, ztreeStyle: { width:'260px', overflow: 'hidden', position: 'fixed', border: '0px none', left: '85rem', top: 'auto', }, }); ``` ### 2021-02 Blog UI更新 更新了一下博客的ui。好久不看php的代码,有点新鲜,函数堆砌。 不过不用编译保存即执行改起来有种好清爽的感觉... ### 2021-03-12 添加了RSS功能 有第三方库。 [Universal Feed Generator: Generate feeds in RSS 1.0, 2.0 an Atom formats](https://www.phpclasses.org/package/4427-PHP-Generate-feeds-in-RSS-1-0-2-0-an-Atom-formats.html#view_files/files/22277) 但是感觉就简化了xml标签生成,还是直接手写了。 ### 2021-08-01 添加Mathjax渲染 ```diff @@ -81,6 +81,13 @@ + + @@ -97,10 +104,13 @@ content = marked.parser( tokens ); content = marked(md,{smartypants: true}); $("#md-content").html(content); ... +MathJax.Hub.Queue(["Typeset", MathJax.Hub, "md-content"]); ``` ## TODO ☑︎ Markdown 目录生成 ☑︎ Mathjax Render □ metadata SEO优化 □ 留言删除功能 □ Tag管理功能 □ sites分类展示 ☑︎ RSS